Tailwind CSS

Tailwind CSS
软件描述
Tailwind 与 Bootstrap、Foundation 或 Bulma 等框架不同,它不是一个 UI 套件。
官方网站
访问软件的官方网站了解更多信息
tailwindcss.com
什么是 Tailwind CSS?
Tailwind 与 Bootstrap、Foundation 或 Bulma 等框架不同,它并非一个 UI 套件。
它没有默认主题,也没有内置的 UI 组件。
另一方面,它也不对你的网站外观做出任何规定,不会强制你执行需要费力推翻的设计决策。
如果你希望使用一个自带预设组件库来构建网站的框架,Tailwind 可能并不适合你,这也是我们提供一些替代方案的原因。
但如果你希望在实现具有独特风格的自定义设计时获得巨大优势,Tailwind 正是你所需要的。
以实用类为先
为构建自定义 UI 而设计的框架,无法在按钮、表单、卡片、导航栏等常规层级上提供抽象。
相反,Tailwind 提供高度可组合的底层实用类,让你轻松构建复杂用户界面,同时避免让两个网站看起来雷同。
组件友好
虽然仅用实用类就能完成大量工作,但有时组件类才是正确选择。
Tailwind 提供工具,可从重复的实用类模式中提取组件类,从而实现通过一处修改即可更新多个组件实例。
核心响应式
Tailwind 的每个实用类都支持响应式变体,让你无需离开 HTML 即可轻松构建响应式界面。
Tailwind 使用直观的 {screen}: 前缀,使你在标记中能轻易识别响应式类,同时保持原始类名清晰可辨且完整不变。
专为可定制而设计
若某项内容适合自定义,Tailwind 就允许你进行自定义。
这包括颜色、边框大小、字体粗细、间距工具、断点、阴影等众多方面。
Tailwind 基于 PostCSS 编写,通过 JavaScript 配置,意味着你可以直接调用真正编程语言的全部能力。
Tailwind 不仅仅是一个 CSS 框架,更是一个创建设计系统的引擎。
🔄 替代方案
106 个选择Bootstrap 是一个用于创建浏览器端网站和应用程序的开源工具集合。它包含基于 HTML 和 CSS 的设计模板,涵盖排版、表单、按钮、图表、导航及其他界面组件,以及可选的 JavaScript 扩展。
Foundation 是由 Zurb 开发的响应式前端框架,包含可定制的 HTML、CSS 和 JS 资源,可用于创建语义化、设备友好的网站和邮件,促进无障碍访问和内容聚焦,并为设计师和开发者提供工具。

Bulma
一个基于 Flexbox 的现代 CSS 框架。

Semantic UI
包含50多个组件和3000多个CSS变量的UI框架,确保响应式设计。可无缝集成React、Angular及其他框架,实现自定义主题。

UIkit
一个轻量级且模块化的前端框架,用于开发快速而强大的网页界面。
Material UI
Material UI 是一个开源的 React 组件库,实现了 Google 的 Material Design。它功能全面,可开箱即用,适用于生产环境。
CSS
层叠样式表(CSS)是一种为网页文档添加样式(例如字体、颜色、间距)的简单机制。


