前言（废话）：
-- 最近在用node写一个后台的统计信息系统，架子在重新搭，以前也写过一些general的样式，主要是为了把一些手贱写在标签style中样式抽离，也有一点省事、节省css代码的考虑。
-- 这两天看布局，偶然看到你这个lib.css，基于造轮子的想法，直接拿来用了，用了这两天发现一些小问题，提供几个意见，能提供思路最好，不成熟的话就当个吐槽随便看看。
-
建议将css迁移或者重构为sass：
-- 原因：zxx.lib.css中"single CSS"里面，多是一些很碎，很杂的style，一般得需要三个以上的组合才能达到自己想要的效果。
-- 栗子：就拿字体来说，为了实现白色宋体24号字（就不考虑背景色的问题，不然又需要叠加），这样这个元素的class必然需要class='f24 fs wh'，再加上一些需要自定义的属性，就需要更多的class，整个结构看起来就很烦。
-- 建议：将css迁移到sass中，或者用sass重写，比如一些明显循环的f0-f24就可以用sass里面的【@for】实现循环，简单明了。关键是sass可以自动编译为min.css，也实现了另一个issues提出的压缩css。
-
class的长度和构造：
-- 原因：你里面大多是吧每个样式单词的首字母拼接构成一个class，固然使每个class的长度减短，便于快速代码编写，但是不可避免的出现的常见的问题：命名冲突。
-- 栗子：.fa{font-family:Arial;}。图标库Font Awesome中，v4.0后，图标库的使用class的标示就是"fa"，这个class刚好跟他冲突，如果使用Font Awesome就必须把这个class从css删除或者改为其他的。
-- 建议：
- 早期我写general.css的时候，基本都是最简单的style抽离，即把
<div style="display:none;"></div>改为<div class="dispaly-none"></div>，后来发现这种写法只是将style抽离、减少了回流、增强了代码的可读性，并不能真正的快速代码编写，因为最简单的看，字母和字符的数量并没有减少。
- 后来将其中一部分转为
..ml-05em {margin-left: 0.5em;}``.ml-10em {margin-left: 10em;}``.ml-8 {margin-left: 8px;}``.ml-40 {margin-left: 40px;}，这样基本降低了代码量，而且基本能在mobile和pc端通用，毕竟mobile中px的鸡肋很烦。
- 再后来，看了sass和bootstrap的less写法，发现很多东西可以构造为模块化（或者叫做组件化），于是开始各种类'bg-danger/bg-primary'这种代表一定聚类的写法，然后用sass或者less的变量去动态编译到对应的css，再用起来比较舒服。而且可以把一些通用的单体样式（你的这种signal-css）聚合成一些集合去用。发现效果不错，只不过一个最大的缺点就是很难做的通用，整体sass切换到另一个系统后，如果风格不同，就需要改变较为多的变量。
跑偏了有点远，说点有用的：
这种 .dn{display:none;} .di{display:inline;} .db{display:block;}，我认为是class过短了，很容和其他的库或者未知人的代码冲突，建议使用-连接或者添加整个单词来作为class，比如dnone，这个样重复的概率明显降低，而且可读性比'dn r tl'略高(dnone,fring,ta-left)。
其实每个人/项目，每个css都有基于业务的独特解读，如果要通用就必须牺牲一些东西。
所以取舍在于你，但是css转向sass应该算是大势所趋，太多的框架已经做出了选择。
前言（废话）：
-- 最近在用node写一个后台的统计信息系统，架子在重新搭，以前也写过一些general的样式，主要是为了把一些手贱写在标签style中样式抽离，也有一点省事、节省css代码的考虑。
-- 这两天看布局，偶然看到你这个lib.css，基于造轮子的想法，直接拿来用了，用了这两天发现一些小问题，提供几个意见，能提供思路最好，不成熟的话就当个吐槽随便看看。
建议将css迁移或者重构为sass：
-- 原因：zxx.lib.css中"single CSS"里面，多是一些很碎，很杂的style，一般得需要三个以上的组合才能达到自己想要的效果。
-- 栗子：就拿字体来说，为了实现白色宋体24号字（就不考虑背景色的问题，不然又需要叠加），这样这个元素的class必然需要class='f24 fs wh'，再加上一些需要自定义的属性，就需要更多的class，整个结构看起来就很烦。
-- 建议：将css迁移到sass中，或者用sass重写，比如一些明显循环的f0-f24就可以用sass里面的【@for】实现循环，简单明了。关键是sass可以自动编译为min.css，也实现了另一个issues提出的压缩css。
class的长度和构造：
-- 原因：你里面大多是吧每个样式单词的首字母拼接构成一个class，固然使每个class的长度减短，便于快速代码编写，但是不可避免的出现的常见的问题：命名冲突。
-- 栗子：.fa{font-family:Arial;}。图标库Font Awesome中，v4.0后，图标库的使用class的标示就是"fa"，这个class刚好跟他冲突，如果使用Font Awesome就必须把这个class从css删除或者改为其他的。
-- 建议：
<div style="display:none;"></div>改为<div class="dispaly-none"></div>，后来发现这种写法只是将style抽离、减少了回流、增强了代码的可读性，并不能真正的快速代码编写，因为最简单的看，字母和字符的数量并没有减少。..ml-05em {margin-left: 0.5em;}``.ml-10em {margin-left: 10em;}``.ml-8 {margin-left: 8px;}``.ml-40 {margin-left: 40px;}，这样基本降低了代码量，而且基本能在mobile和pc端通用，毕竟mobile中px的鸡肋很烦。跑偏了有点远，说点有用的：
这种
.dn{display:none;} .di{display:inline;} .db{display:block;}，我认为是class过短了，很容和其他的库或者未知人的代码冲突，建议使用-连接或者添加整个单词来作为class，比如dnone，这个样重复的概率明显降低，而且可读性比'dn r tl'略高(dnone,fring,ta-left)。其实每个人/项目，每个css都有基于业务的独特解读，如果要通用就必须牺牲一些东西。
所以取舍在于你，但是css转向sass应该算是大势所趋，太多的框架已经做出了选择。