CSS优化小结

一次面试的时候因为简历上写了一句了解CSS代码优化，面试官就问CSS有哪些地方可以优化，我答了尽量减少选择器的嵌套和使用样式继承，自己后来感觉还有一些可以说的，这里都列出来，方便以后应对面试。

1. 添加注释，可以是说明一块样式是针对页面哪一部分的，或者是哪个功能，可以是对作用不明显的样式或属性做说明，注释主要是为了方便别人接手代码或者自己一段时间后修改代码；
2. 使用继承：继承是指应用在某个标签上的CSS属性传给了内部嵌套的标签，可以应用继承的样式通常是字体和颜色，可以通过继承写在父元素上，而不必在每个子元素上单独写，从而简化样式表；
3. 类名根据用途而不是外观或位置来取；
4. 一类元素有公共样式可以定义一个公共的类名放置公共的样式避免重复，比如一系列按钮有相同的尺寸、边框和字体，就可以把这三个样式放到一个类名下；
5. 使用属性的简写形式，包括：字体、边框、内外边距、过渡、背景和列表等
6. 后代选择符用还是不用？使用后代选择符可以减少类名的使用，从而减小HTML的体积，这一点其实是对HTML的优化，对于结构复杂的大型页面，这个问题还是很明显的，我在上家公司开发公司网站首页的时候一开始用了大量的类名，最后架构师要求我缩减HTML体积以加快页面加载速度，我就减少了类名的使用，增加了后代选择符的使用。
7. 使用多个样式表还是合并样式表？这个其实也有些争议，以前公司的架构师要求页面的样式尽量都放到一个css文件里，减少http请求，简单的样式甚至要求我放到HTML里，这样其实对加载速度没有明显的提升，因为浏览器是可以并发请求资源的，这样反而不利于前端的样式管理，后来来了一个前端领导，要求我们还是把样式文件分开，样式也模块化。