前端小白基础之CSS部分编码规范

1、文件名规范，建议用小写字母加中横线的方式

2、属性书写顺序，从外到内，直接影响盒子模型和位置盒子的属性文本属性css3或者其他属性。这是为了方便修改代码的时候能直接找到，还有代码的优先级

3、选择器的性能，写sass或者less不要套太多层，不然会出现匹配时间变长，代码的可读性也比较差

4、避免选择器误选，维护的时候对尽量定个选择器的具体位置和名称，防止和别的样式起冲突

5、少用!important

6、多写注释，方便后期维护寻找代码

7、排版规范，把编辑器table缩进调成4个空格，这样是方便观察代码，同时也美观，没有2个空格那种紧凑感

8、属性值规范，值为0的时候，后面通常不带单位颜色用十六进制，少用rgb（rgb是函数，需要计算转换），如果要透明度那就再用rgba，颜色如果是留个相同的数字或者英文，可以简写成3个

9、不要设置太大的z-index

10、合并属性，例如margin-top,margin-bottom,margin-left，margin-right，这四个属性可以合成一个margin: top right bottom left。让代码看起来简洁

11、 注意float/absolute/fixed定位会强制设置成block

12、清楚浮动 .clearfix:after，一般用这个方法，也有其他可以自己去看看

13、图片压缩，拿到图片的时候要检查下图片的大小，不能用太大的图，影响加载速度，要压缩，图片控制在300k以内