# 看了几篇讲 Tailwind CSS 的文章 (February 3, 2023)

[《 Tailwind CSS 浅析 》](https://geeknote.net/Rei/posts/353)

> <font style="color:rgb(26, 26, 26);">如果要新增一个类似的元素，是先把它抽象成组件类，还是复制一份？我想很可能是复制一份，因为除了页面最初的设计者，维护者很难全面掌握整个项目有多少样式是可重用的。</font>
>
> **<font style="color:rgb(26, 26, 26);">所以我认为适合 Tailwind CSS 的场景是一次性的设计，例如首页、活动页。</font>**
>

<font style="color:rgb(26, 26, 26);">我觉得这个说的很准确</font>

---

[《 Tailwind CSS，从入坑到退坑 》](https://geeknote.net/Rei/posts/1995)

讲的都是**只使用**Tailwind会带来的麻烦（个人目前认为基本上可以通过结合部分手写的css以及`@apply`解决）

提到了一个点，说**原子化css避免了给**`**.classes**`**命名的麻烦**

有一点我觉得概括的挺好，例子很典型：

> **重复设计**
>
> <font style="color:rgb(26, 26, 26);">虽然在初次编写的时候使用预置的 token 很方便，但是第二次就麻烦了。上次用的颜色是什么，边距是什么？我需要反复打开一切写过的组件确认，避免产生样式的不一致。</font>
>

<font style="color:rgb(26, 26, 26);">作者还说：</font>

> <font style="color:rgb(26, 26, 26);">最好的代码不是为编写优化，而是为阅读优化的。</font>
>

---



[https://adamwathan.me/css-utility-classes-and-separation-of-concerns/](https://adamwathan.me/css-utility-classes-and-separation-of-concerns/)



---

说起来，如果叫我来给我自己的 GUI 框架设计一种 style sheet 语言，我觉得 css 中的一些符号需要改进

+ .classes 变成 #tags
+ #id 变成 @id
+ .props 检查属性值

将来有空研究研究 AST