难度级别:中高级及以上 提问概率:70%
CSS是前端开发工作中必不可少的技能之一,同时也是网页开发中必不可少的重要元素之一。但很多人所开发的项目本身对性能要求并不高,再加上项目周期紧张,久而久之,也就容易养成不考虑细节的习惯,觉得CSS无非就是做一些布局性的工作。那么如果从性能优化的角度考虑,有哪些细节和方案需要注意呢,一起来看一下吧。
1 CSS属性要按顺序编写
很多人在编写CSS属性的时候,并没有一定的顺序逻辑性,想到哪里就写到哪里,类似蓝湖这些设计工具会带有一定的CSS代码,所以很多人先从工具中复制CSS代码,再补充自己需要的一些属性,这样其实是不对的。CSS属性编写应该按照定位、盒模型、可视属性、其他属性的顺序来编写,就像这样
CSS代码:
<style>
.box {
/* 定位相关属性 */
position: absolute;
top: 0;
right: 0;
z-index: 1;
/* 盒模型相关属性 */
margin: 10px;
width: 200px;
height: 200px;
border: 1px solid red;
padding: 10px;
/* 可视属性相关 */