相信大家都听说过‘
知识的诅咒’，就是说一个人，一旦拥有某种知识之后，就很难想象自己不知道这个知识的场景。这就使得拥有知识的人很难跟没有拥有这个知识的人进行有效的沟通，因为信息的不对等，拥有知识的人会根据自己的理解去解释这个东西，但是他想象不到没有拥有知识的人如何去理解这东西。
前言
在我学会了unocss之后，我现在就很难想象出当初那个不知道它的我是什么样的感受。
只是依稀记得，在我没有学会原子化css之前的感受是这样的：这个原子化css很麻烦，阅读起来很不友好，class写得也太长了，真是反人类，这么多类名怎么记得住，为什么会有人喜欢使用这种方式写css，完全没有统一写css样式那样方便等等...
不知道大家有没有我的这种感受哈，反正我现在就记得这些了，希望大家可以把自己感受写到评论区，一起共鸣一下^_^！
下面我跟大家说一下我目前的一个感受吧：
-
我目前做的一个项目使用的是unocss，目前我了解的原子化css框架就三个
Tailwind CSS、Windi CSS和unocss。听说还有Tachyons和Basscss,不过我没有接触过。 -
原子化css是将css属性样式通过一定的规则简化为css类的写法。通过插件还可以直接写为标签的属性，不用写在class里面。
-
现在看类名都比较直观，通过类名就知道这个是什么样式，不用原本的跳转到对应的类进行查看。修改起来比较方便。
-
现在class类还是太长了，有一些都超出了一行的显示字数。
-
对于一些可以继承的属性还是不太属性，很多都是重复分类名。
-
对于常用的，太长的类名，我们可以自己定制成规则，放到配置文件里面。
-
有一些特殊的css属性没有预定的类名。用起来还是不太方便。不过我可以写到原生的css类当中，放到css文件里面，还是挺方便。
总的来说，unocss还是很好用的，不会的时候我想这tm是个什么东西，看到的都是缺点。会用之后，还挺香的。
给大家说一说我现在使用unocss的一个模式:
- 大部分css样式都是写到class当中，一些特殊的，会用原始的css类来写。
- 如果修改框架的css，就是写到css文件当中。
- 如果有多个重复的内容，能用v-for的就使用循环。不能的就提为组件。
- 一些特殊的，写起来不方便的类，就写到css文件当中。
- 如果太长，有多个地方使用的特殊类名，就配置到unocss.config.js中。
- 不会的类名，就去问ai。直接将原始的css样式发过去，让它返回unocss类名。
给大家说一下我使用unocss的现状：
- 宽度
w-100px 或者 w-full w-100vw - 高度
h-100vh - 内边距
p-10px px-10px py-10px pt pr pb pl - 外边距
m-10px - 边框
border-1px border-solid border-#ffffff border-t - 圆角
rounded-10px - flex布局
flex flex-col justify-center - grid布局
grid grid-cols-24 grid-rows-2 - 背景
bg-#fff - 颜色
c-#fff - 字体大小
text-12px - 字体粗细
font-400 - 文字颜色
text-#999 - 行高
leading-20px - 阴影
shadow-[10px_0_16px_0_rgba(0,0,0,0.06)] - z-index
z-100 - 盒子模型
box-border - 定位
abslote top right bottom left - hover效果
hover:bg-#ccc - 超出隐藏
overflow-x-hidden - 文字换行
whitespace-nowrap text-align-end
以上只是一部分class，相关的类名都差不多，只要掌握了规则，基本上都能猜出一个大概。
unocss相关的一些资料
能看到这里，说明你还是想学习的，其实原子化css没有那么难，能够成为很多大型项目的选择说明优势也比较明显。现在就去行动吧，不要拖延了。
交互式文档：unocss.jiangruyi.com/interactive…
中文文档：unocss.jiangruyi.com/guide/confi…
github：github.com/unocss/unoc…
除了以上这些，我们现在编辑器里面都是有相关的插件的，可以给我们进行快速提示，或者解释相关类名的对应css
在vscode或者webstorm中搜索unocss，安装相关插件，加快我们的开发效率。
结语
天下大势，合久必分，分久必合。 我们使用一个技术，不用局限于只能使用这个技术的规则，可以结合我们已经掌握的其他技术，慢慢过渡，去粗取精，相互结合。 我们不用追求极致，追求极端，多去尝试新鲜的事物。
谨以此文献给那个勇敢学习新知识的曾经自己。
