为什么越来越多的人开始选择使用Tailwindcss

更新日期: 2022-04-26 阅读: 2k 标签: Tailwind

什么是 tailwindcss

首先它是一个通用的类 css 框架,它内置了很多方便使用的 class,比如 text-center,pt-4,rotate-90,通过使用这些内置的样式,你可以非常快速地构建出一个网站的雏形。

tailwindcss 从大小,颜色,字体,阴影方面去优化你的界面,你可以通过它们的组合搭配构建出最满意的视觉效果。


强大的的包容性

如果你真的使用过 tailwindcss 的话,你会发现它的包容性非常强,一个固定的 html 结果,你完全可以使用 tailwindcss 的不同样式而构建出不同的网页效果,可以说你写了一套 html 代码,通过 tailwindcss 你就相当于有了好几个不同的主题。


精简代码

可以说随着项目的发展,总是会或多或少遗留一些未使用过的 css 样式,随着时间的积累,它们会越来越大,导致加载速度变慢,导致维护起来也变得困难,不过这些在使用 tailwindcss 的时候完全不存在,tailwindcss 会自动删除未使用的样式,通过处理器删除未使用的 css 之后,大部分的 css 都会变得非常小。


响应式支持

我们知道通过媒体查询是可以实现页面的响应式的,tailwindcss 通过内置不同的宽度前缀样式来实现响应式,tailwindcss 使用移动优先策略,也就是说无前缀的样式所有页面宽度都适用,而有前缀的样式只在特殊的宽度设备上适用。当然,对于 tainwindcss 还支持你自定义媒体查询宽度。


暗黑模式

自从苹果推出了暗黑模式后,现在不管是手机应用,还是网页应用,还是 pc 应用,都会尽量提供暗黑模式,也就是深夜模式。 tailwindcss 是支持暗黑模式的,而且使用非常方便,只需要在样式类前面加上dark:就可以实现。


支持自定义

tailwindcss 之所以被越来越多的人喜欢可不仅仅是它的精心设计的内置样式,而是它支持自定义的样式配置,支持你扩展原来的样式表,从调色板,到间距,到阴影等,你都可以自己去定义,这对于要求高度还原设计的网站绝对是必须的。


编辑器的支持

对于前端工程师来说,vscode 已经成为了标配开发工具,而 tailwindcss 为此提供了智能提示插件,安装了该插件之后,在写 css 的时候你也能体会到自动补全,并且它还会对一些错误的类定义进行语法提示,可以说非常智能。


网友们的评价

一个人说好不算好,需要大家说好才算好,下面总结一些网友们对它的评价:

  • 直到现在才使用 tailwindcss,我觉得我就是白痴。
  • Tailwindcss 让编写代码感觉就像我在使用设计工具。
  • Tailwindcss 是这个星球上最伟大的 css 框架。
  • Tailwindcss 正在弥合设计系统和产品之间的差距。它正在成为事实上的样式 api
  • 我再也不想写普通的 css 了。只有 tailwindcss。
  • 在我使用它的那一刻我就爱上它了。
  • Tailwindcss 同时让 css 变得有趣,并彻底改变了我构建产品的方式。它快速,高效,使用起来非常愉快。
来自:https://www.toutiao.com/article/7090449733701042702


本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!

链接: https://fly63.com/article/detial/11393

为什么使用Tailwind Css框架

以上代码就是举个例子,大部分情况应该都是写一个类,然后整一堆样式进去。这种方式写多了以后,会感受到一些痛点,比如说:取名困难,需要用 JS 控制样式的时候又得多写一个类

客观评价 增长趋势比 vite 还猛的 TailwindCSS

如果你是一个团队做 SAAS 产品,需要在统一的产品风格主题上面展开,并且使用 React 之类可以模块化x组件的前端框架,那麽 TailwindCSS 会是很值得导入的样式解决方案。

加速 JavaScript 生态系统 - Tailwind CSS

诚然,我目前手头没有使用 Tailwind CSS 编写的更大项目。那些使用 Tailwind 的公司范围太小,无法进行有意义的性能分析。所以我想还有什么比在 Tailwind 自己的 tailwindcss.com 网站上介绍 Tailwind 更好的方法呢

Tailwind CSS为什么成为AI编程的好帮手

编写代码不是简单的事,需要花费很多时间。即使有各种开发框架,写前端代码仍然很繁琐。正因为这样,大家一直在寻找更好的工具来简化这个过程。Tailwind CSS就是其中一个很受欢迎的工具,它能帮助开发者快速构建用户界面。

TailwindCSS 和 UnoCSS 性能对比:2025年最新测试结果

TailwindCSS 4 已经正式发布,当前最新版本是 4.1.13。这个新版本不仅增加了新功能,还提升了性能,而且定位也发生了变化:从一个 PostCSS 插件变成了“样式预处理器”。

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!