发布于 2026-01-06 7 阅读
0

既然有 Tailwind CSS,为什么还要用 Bootstrap 做网站呢!

既然有 Tailwind CSS,为什么还要用 Bootstrap 做网站呢!

Tailwind 与其他框架有何不同?

Tailwind与 Bootstrap、Foundation 或 Bulma 等框架的不同之处在于,它不是一个 UI 工具包。

大多数 UI 框架,例如 Bootstrap、Material UI、Bulma 等,都预先设计了卡片、按钮、导航栏、提示框等 UI 组件。您可以使用这些组件,并在此基础上创建设计。

但在Tailwind CSS中,你不会得到一套预先设计好的组件,而是得到实用类。你可以组合这些实用类来创建布局和组件。
由于 Tailwind 非常底层,它从不鼓励你重复设计同一个网站。即使使用相同的调色板和尺寸比例,在下一个项目中也很容易构建外观完全不同的相同组件。

它没有默认主题,也没有内置的用户界面组件。

框架

另一方面,它对你的网站外观没有任何意见,也不会强加你必须努力才能撤销的设计决策。

如果您正在寻找一个带有预先设计好的小部件菜单的框架来构建您的网站,那么 Tailwind 可能不适合您。

但如果您想快速实现具有独特风格的自定义设计,Tailwind 可能正是您所需要的。

实用性优先

为构建自定义 UI 而创建的框架意味着您无法在按钮、表单、卡片、导航栏等常规级别提供抽象。

相反,Tailwind 提供了高度可组合的底层实用程序类,可以轻松构建复杂的用户界面,而不会让任何两个网站看起来相同。

响应式设计:
如果您使用 Tailwind CSS,则无需编写自定义样式来处理不同屏幕尺寸的响应式设计。您可以使用 Tailwind 的响应式工具轻松实现这一点。

像Bootstrap这样的框架有一个主要的缺点。由于增长和使用量增加,它们变得过于庞大,对样式的控制也越来越少。学习像 Bootstrap 这样的框架变得越来越困难,因为开发者需要学习数百个类。

Tailwindbootstrap在开发领域都有各自的用武之地,但你最好先学习纯 CSS 作为一项基本技能,然后再尝试使用这两个框架,并在充分理解的基础上做出决定。

这篇文章就到这里啦😇。希望这篇文章对您有所帮助。欢迎在评论区留言分享您的想法、评论或反馈,或者您也可以通过推特jobpick.in私信我们。

文章来源:https://dev.to/jobpick/why-make-a-bootstrapy-website-if-there-s-tailwindcss-5c3c