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 个选择
PaperCSS
我对互联网上现代风格和简洁页面感到厌倦。我还想更深入地学习 Flexbox 和 Less。因此,我开发了 PaperCSS 来解决这两个问题 :)

Shoelace.css
Shoelace.css 是一个入门套件,而非框架。它通过 CSS 变量进行定制,无需 Less、Sass 或任何预处理。压缩版本仅 35.3KB,压缩后更小。

YAML CSS Framework
Yet Another Multicolumn Layout (YAML) 是一个模块化的 CSS 框架,用于构建真正灵活、可访问且响应式的网站。

GenesisUI
功能强大的Bootstrap后台模板!精选的高端Bootstrap后台模板合集。

Leaf (CSS Framework)
一个基于谷歌材料设计的CSS框架。

Tailflows
Tailflows.com 是一个专注于 TailwindCSS 开发者的创新平台。Tailflows 提供了丰富的工具和模板,旨在简化并加速您的开发流程。主要功能包括:


