CSS最佳实践

我相信以下四条会帮助你提升你的CSS代码

• 掌握CSS特殊的层次结构

* - 0
p - 1 (one element)
li:first-of-type - 2 (one element, one pseudo-element)
ul li - 2 (two elements)
ul ol + li - 3 (three element)
h1 + *[href*=index] - 11 (one attribute, one element)
ul ol li.list-item - 13 (one class, three elements)
li.list0item.list-item-inline - 21 (two classes, one element)
<p style=""></p> - 1000 (one inline styling)
p - 1 (one HTML selector)
atticle p - 2 (two HTML selectors)
.class -10 (one class selector)
div p.class -12 (two element selectors and a class selector)
#id - 100 (one id selector)
html #id .class p - 112 (element selector,id selector, class selector, element selector; 1+100+10+1)

• 避免使用 improtant 声明，同事不要使用ID进行样式书写
  这两件事可以避免恶性循环！

• 避免层级过高的元素
  它会让浏览器执行过多渲染你样式的不必要周期，这会降低性能和带来不佳的用户体验。

• 使用 reset 或者 normalize 样式表来避免浏览器的不一致
  但要确保根据你具体的状况来量身定制。不然的话就会让你的CSS变得冗（rong）杂。