CSS优化、提高性能的方法
- 将样式尽量写在单独的一个css文件中,然后在head元素中引用;
好处:
1.内容和样式分离,易于管理和维护;
2.减少页面体积;
3.css文件可以被缓存、重用,维护成本降低; - 不使用@import, @import影响css文件的加载速度;
- 避免使用复杂的选择器,层级越少越好,建议选择器的嵌套最好不要超过三层简洁的选择器不仅可以减少css文件大小,提高页面的加载性能,浏览器解析时也会更加高效,也会提高开发人员的开发效率,降低了维护成本;
- 精简页面的样式文件,去掉不用的样式;
- 抽象提取公用样式,减少代码量;
- 标准化各种浏览器前缀,带浏览器前缀的在前,标准的在后;
- 利用CSS继承减少代码量;
- 慎重使用高性能属性:浮动、定位;