CSS优化提高性能的方法有哪些

加载性能

• css压缩：将写好的css进行打包压缩，可以减小文件体积。
• css单一样式：当需要下边距和左边距的时候，很多时候会选择使用margin-left:20px;margin-bottom:30px。
• 减少使用@import，建议使用link，因为后者在页面加载时一起加载，前者是等待页面加载完成之后再进行加载。

选择器性能

• 选择器优化嵌套，尽量避免层级过深，最高不超过三层。
• 建议使用class或id选择器，避免使用标签来限制class选择器或者id选择器。
• 避免使用通用选择器或者子选择器。
• 选择器优化嵌套，尽量避免层级过深。

渲染性能

• 属性值为0时，不加单位。
• 可以省略小数点之前的0。
• 标准化各种浏览器前缀：带浏览器前缀的在前。标准属性在后。
• css雪碧图，同一页面相近部分的小图标，方便使用，减少页面的请求次数，但是同时图片本身会变大，使用时，优劣考虑清楚，再使用。
• 不滥用web字体。对于中文网站来说WebFonts可能很陌生，国外却很流行。web fonts通常体积庞大，而且一些浏览器在下载web fonts时会阻塞页面渲染损伤性能。

可维护性、健壮性

• 将具有相同属性的样式抽离出来，整合并通过class在页面中进行使用，提高css的可维护性。
• 样式与内容分离：将css代码定义到外部css中。