深度解析 tailwindcss 设计源规则

文章预览

这段时间陆陆续续收到了很多朋友对于如何更进一步使用 tailwindcss 的提问，发现大家在学习和使用 tailwindcss 的过程中，并没有掌握真正的核心的要点。所以经常会在一些时候比较无所适从。例如， 如果公司有自己的设计规范，我应该如何调整 tailwindcss 去自定义我的设计方案？ 又或者有的同学不太喜欢 tailwindcss 的默认尺寸 m-1 表示 margin: 0.25rem 。要如何通过配置去修改它。 这篇文章，我就从 tailwindcss 源规则 的角度，为大家重新分享一些如何去做自定义的设置。 读懂基本规则 虽然 tailwindcss 的源规则比较简单，但是很显然，很多人并没有读懂它。 我们以其中一个比较常用的 class 为例，为大家解析一下源规则。 当我想要给一个元素这只 margin 值时，我会采用如下的写法 class = "m-4" > < /div> 针对 m-4 我们要分成两个部分去解读它。 前面一个部分 m ………………………………