提高CSS性能

1、选择器

• 了解CSS的查找匹配原理，让CSS更简洁、高效
• 使用高效率的CSS选择器
• 如何使CSS渲染更高效

总结

1. 不要在ID选择器前使用标签名 一般写法：div#divBox
   更好写法：#divBox
   解释： 因为ID选择器是唯一的，加上div反而增加不必要的匹配。
2. 不要再class选择器前使用标签名
   一般写法：span.red
   更好写法：.red
   

   解释： 同第一条，但如果你定义了多个.red，而且在不同的元素下是样式不一样，则不能去掉，比如你css文件中定义如下：
   p.red { color: red; }
   span.red { color:#ff00ff; }
   如果是这样定义的就不要去掉，去掉后就会混淆，不过建议最好不要这样写

3. 尽量少使用层级关系
   一般写法：#divBox p .red { ... }
   更好写法：.red { ... }
4. 使用class代替层级关系
   一般写法：#divBox ul li a { display: block; }
   更好写法：.block{display:block;}

本文非原创，旨在整理和自我学习。