
页面布局
container居中内容。block / inline-block 块级或内联块级元素。flex / grid Flexbox 或 Grid 布局。flex-col / flex-row Flex 布局方向:列/行。items-center垂直居中对齐项目。justify-center水平居中对齐项目。gap-1 – gap-12 项目间距。—
间距与填充
m-{size}外边距:mt, mb, ml, mr。p-{size}内边距:pt, pb, pl, pr。{size} 值0, px, 1 – 96 等。—
文本样式
text-{size}字体大小 (例如:text-sm)。font-bold粗体文本。font-medium中等粗细文本。font-light细体文本。text-left / text-center / text-right 文本对齐方式。text-gray-500文本颜色。—
背景样式
bg-{color}背景颜色。bg-gradient-to-r从左到右的渐变背景。bg-opacity-{value}背景透明度。—
边框样式
border默认边框宽度。border-{color}边框颜色。rounded / rounded-{size} 圆角。—
阴影效果
shadow-sm小阴影。shadow-md中等阴影。shadow-lg大阴影。shadow-none无阴影。—
尺寸设置
w-{size} / h-{size} 宽度/高度 (full, auto, 百分比)。max-w-{size}最大宽度。min-h-{size}最小高度。—
Flexbox 对齐方式
justify-start项目起始位置对齐。justify-between项目间距平均分配。items-start项目顶部对齐。—
元素定位
absolute / relative 定位模式。top-{value} / left-{value} 偏移值。z-{value}Z-index (层叠顺序)。—
颜色选择
text-blue-500蓝色文本颜色。bg-green-300绿色背景颜色。border-red-400红色边框颜色。—
过渡与动画
(此处应补充过渡和动画相关的实用类名及描述)
无涯·问知
无涯·问知,是一款基于星环大模型底座,结合个人知识库、企业知识库、法律法规、财经等多种知识源的企业级垂直领域问答产品
153 查看详情
以上就是Tailwind CSS 备忘单的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1150472.html
微信扫一扫
支付宝扫一扫