浏览器兼容性查询工具,写前先查省掉返工
Tailwind CSS
原子化 CSS 框架官方站,文档本身就是设计系统教科书
内容更新日期 · 2026-09-07
What is it · 它是什么
什么是 Tailwind CSS
Tailwind CSS 是“原子化 CSS”框架的代表:不写传统 CSS 类,直接在 HTML 上组合工具类(如 flex、pt-4、text-slate-500)拼出界面。官网文档是它的第二卖点——每个类有说明和示例,搜索极快,内置的间距/颜色体系本身就是一份设计系统教材。
How to use · 怎么用
怎么用 Tailwind CSS
- 从安装指引(按你用的框架选)起步。
- 之后把它当字典用:想要什么效果就搜对应类名。
- 主题定制(品牌色、字体、圆角)在一处配置,全局生效。
- 官方付费组件库(Tailwind Plus)的现成组件也能当布局参考。
- 上手初期会觉得类名太长,坚持做完一个整页就会理解它的效率。
Key features · 核心特点
Tailwind CSS 的核心特点
- 原子类直接在标记里组合,不用起类名、不用跳文件
- 内置设计约束(间距/颜色/字号成体系),天然防“随手写死值”
- 文档质量高,搜索即所得
- 核心框架免费开源,官方付费组件库可选
