Tailwind CSS

Tailwind CSS 最初由 Adam Wathan 开发，第一个版本早在 2017 年 11 月 1 日就已发布。Tailwind CSS 是一个实用优先的 CSS 框架，用于快速高效地构建自定义用户界面。它是一种内联样式设计，用于在无需为自己的 CSS 编写代码的情况下实现时尚的界面。Tailwind CSS 具有可定制性和灵活性，可改变元素的外观和感觉。Tailwind CSS 并不是第一个实用至上的 CSS 库，但却是最流行、最轻便的 CSS 库之一。它是一个高度可定制的低级 CSS 框架，为开发者提供了为任何网站构建美妙界面所需的所有构件。

Bootstrap

Bootstrap 是由 Mark Otto 和 Jacob Thorton 在 2011 年 8 月 Twitter 的一次内部竞赛中开发的。它是一个开源框架，用于更好、更快、更简单地设计响应式网站。它是一个对初学者友好的、最流行的开源框架，包括 HTML、CSS 和 JavaScript。Bootstrap 可用于使用 Java、PHP 等任何服务器端技术创建网络应用程序，其响应式设计允许在手机、平板电脑和电脑等平台上使用。Bootstrap 包含基于 CSS 和 JavaScript 的设计模板，用于排版、表单、按钮、导航、图标和其他界面组件。它基于面向对象的 CSS。Bootstrap 有助于快速设计和开发网站模板。

不同版本的 Bootstrap：

  • 2.0 版支持响应式网页设计。
  • 3.0 版支持移动优先设计。
  • 4.0 版引入了 SASS 和 Flexbox 支持。

Tailwind CSS和Bootstrap对比

Tailwind CSS Bootstrap
Tailwind 提供预先设计的 widget，可从零开始快速开发用户界面。 Bootstrap 附带一套预设风格的响应式移动优先组件，拥有明确的用户界面套件。
Tailwind CSS 使用一组实用工具类来创建整洁的用户界面，具有更高的灵活性和独特性。 使用 Bootstrap 创建的网站遵循通用模式，看起来千篇一律。
使用 Tailwind CSS 创建的网站可定制性更强。 使用 Bootstraps 创建的网站以响应速度快、设计完美无瑕而著称，但外观却很普通、相似。
Tailwind CSS相对较新，在社区方面仍有很大的发展空间，但它正在与日俱增，用户、参考资料、工具和相关网站的数量也在不断增加。 Bootstrap 非常高效，可以节省大量时间。作为最流行的 CSS 框架，它拥有庞大的开发者社区、论坛、工具等。
Tailwind CSS 只需要基本样式表文件，文件大小仅为 27kb，因此更加轻便。 Bootstrap 有四个文件需要包含在你的项目中，这样才能充分享受 CSS 框架带来的好处。这些文件的总大小为 308.25kb，包括 jQuery、Popper.js、Bootstrap JS 和 Bootstrap CSS 主文件。
Tailwind的CSS被BlaBlaCar、Exyplis和Bazzite使用。 Spotify、Twitter 和 Lyft 等知名公司也使用了 Bootstrap。