页面布局
实用类名 描述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红色边框颜色。—
过渡与动画
(此处应补充过渡和动画相关的实用类名及描述)
以上就是Tailwind CSS 备忘单的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2845595.html