标准答案
- Tailwind 提供大量原子工具类,开发者可以直接在模板里组合布局、间距、颜色和响应式样式。
- 它的优势是少起类名、样式靠近结构、约束来自配置 token,删除组件时样式也更容易跟着删除。
- 它适合组件化项目、设计 token 明确的项目和需要快速交付的界面。
- 风险是模板类名过长,复杂状态难读,团队绕开 token 后仍会样式失控。
- 大型项目需要抽组件、抽设计 token、限制任意值滥用,并保持可访问和响应式规范。
题目解析
这题要避免站队式回答。Tailwind 解决的是样式组合效率和约束问题,不是自动带来好设计。
如果团队没有设计 token 和组件边界,Tailwind 也会变成另一种形式的样式散落。
代码示例
工具类让状态、间距和响应式直接写在元素上。
HTML
<button class="rounded-md bg-green-600 px-4 py-2 text-white hover:bg-green-700">
保存
</button>常见误区
- 把 Tailwind 当成不用设计系统的捷径。
- 大量使用任意值,导致 token 约束失效。
- 复杂组件不抽象,模板里堆出难以阅读的超长 class。