标签：__ Tailwind Stylify 使用 实用程序 选择器 CSS
Stylify：实用程序优先的 CSS 库来替换 Tailwind
为什么创建 Stylify 的作者会引起你的共鸣
一个项目使用 Bootstrap，第二个项目使用 Tailwind 和另一个带有自己的实用程序和组件类的 vanilla CSS。
虽然这些工具很棒，而且方法也不“差”，但再次学习和记住类、配置和选择器只是很麻烦而且很耗时。
IDE 插件对类的窃窃私语有时很烦人。我问过自己很多次，为什么没有框架或库使用开发人员已经知道的纯 CSS 属性及其值作为选择器。
风格化
Stylify 根据您编写的内容动态生成优化的实用程序优先 CSS。
受到专注于实用程序类的 Tailwind 和 Tachynos 的启发，他说他进一步推进了这个想法。
与 Bootstrap、Foundation 或 Bulma 不同，它没有预生成的 CSS。
可以在主页上找到一个示例： https://stylifycss.com/
为什么要使用 css 类型属性：值类型？
- 这是因为不使用随机命名的缩短类名就无需学习。
- 不每天使用 Tailwind 的开发人员应该去文档或开发工具看看它做了什么。
- 在风格化，CSS
可见性：隐藏写下来。任何对 CSS 有一点了解的人都知道这是做什么的。在顺风隐你可能认为显示：无；没看到。 (可见性：隐藏为了无形的使用类） - 可维护性：如果浏览器提供了像 Tailwind 这样的属性已经缩短的属性怎么办？ CSS 标准在不断变化。即使是现在，Tailwind 仍在继续更新。
相对于纯 CSS 的优势
因为选择器是动态创建的，所以不需要擦除或维护相关代码。
选择器被重用（ .color\\:red,.button{color:red} ）在生产中缩小（ 文本对齐：从左到短 _zx ）这是可能的。
您无需在编辑器中切换文件即可查看样式文件。
重复 CSS 属性值的存在不会以指数方式增加 CSS 大小。 Facebook 上有关 CSS 大小的文章 有。
动态生成的 CSS 通过在项目中保留更少的文件来减少更改。因此，这意味着优化创建缓存、迁移、js 包等。
如何使用
像 CSS 适当的价值 利用
使用 __（两个下划线）表示空格，使用 ^（帽子）表示引号
基本语法模式是 <screen>?:<pseudo classes> ?:<property> ：<value>
红色
边框：1px__solid__red => 边框：1px 纯红色
宽度：计算（100%__-__8px）=> 宽度：计算（100% - 8px）
font-family:^Open__Sans^ => font-family:'Open Sans'
悬停：颜色：红色
sm：悬停：颜色：红色
而已。
预定义的宏和助手
屏幕
Tailwind 或 Bootstrap 知道预定义的快捷方式，如 sm、md、lg，以及 minw、maxw、rng 等动态屏幕。
通过逻辑运算符 逻辑与 && 和一个 逻辑或 ||
sm&&dark:color:red
minw740px||风景：颜色：蓝色
变量声明
组件定义
自定义选择器
配置
可以预先定义变量声明、组件定义和自定义选择器。
模板变得臃肿且难以维护
零件 可以定义并写为
但是，如果开发人员以自动组件的形式创建可重用组件，则维护起来并不困难。
补充/扩展：宏
您可以为想要使用预定义速记类（如 ml-2 或 py-3）的用户定义自定义宏。
结论
Tailwind 还创建了一个实用程序优先类来创建优化的样式文件，并使用它在生产中生成优化的 css。但是，这需要记住或查找预定义的内容。
- 上面这篇文章的内容是一个汽车改装的采访，但是我理解的有些奇怪。
- 调优成本，高于预期，维护成本不算太高
- 如果你尝试修复它，修复成本也是爆炸性的。
- “它不同于改变和变得更好。”一辆你最终会找到的真正的汽车
我们常常忘记标准的重要性。 W3C标准 你甚至可以拯救这个世界。
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明
本文链接：https://www.qanswer.top/20676/23310700
标签：__,Tailwind,Stylify,使用,实用程序,选择器,CSS 来源： https://www.cnblogs.com/amboke/p/16663840.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。