CSS也需要重构

最初接触到的CSS面向对象，是项目里的CSS超过8千行，缺乏约束和管理，在近期或不远的将来，有迫切的要求需要重构。CSS面向对象和模块化。

CSS代码遇到的问题：

重用性差，看着一个CSS的名称，很难说出哪些模块可能引用到了它，这个CSS是用作网页的哪些部分的；

结果谁也不敢修改和删除，后面的样式只能往上面堆积；

怕CSS重名，s1、s2、t1、t2这样的命名开始出现了，这无异于饮鸩止渴，没有人知道这些样式是做什么的；

于是，CSS越来越大了；

做高保真的美工和业务开发人员思路是完全不同的，我们看到各种风格的CSS定义和命名；

有时候，也会遇到CSS冲突的问题，这一切，还是归结为那一句话：复杂是一切软件问题的根源。

CSS重构的原则：

纵向模块化：由大到小建立CSS模块文件，比如：公用 -> 门户 -> 频道 -> 栏目 -> 内容；

横向模块化：适用于一些独立性高的组件，比如播放器模块、弹出层模块；

提供指导性CSS：例如，准备几套list类型展示的样式，把整个系统中的list展示全部收拢到这一处来，未来皮肤的更换、比较和修改，相当程度上便利了美工；

CSS的拇指原则：如果同一功能区域的两个样式很相近，只保留一个！

框架（栏目）用网格来控制宽度，而内容控制高度，当页面上由若干个栏目组成，每个栏目的宽度可以固定或者被频道按比例固定，但是高度需要取决于内容。

CSS本身是支持继承和模块化的，另外在HTML页面上，也可以比较容易地做到样式和扩展样式的使用。