CSS 结构和层叠

特殊性

选择器的特殊性高低由选择器本身的组成决定，特殊性高的会胜出，采用其申明的方式render.

选择器特权重计算方式：

ID：加 0，1，0，0

类，属性：加 0，0，1，0

元素，伪元素：加 0，0，0，1

结合符和通配符 ：0，0，0，0

如选择器是多个组合，需要求和。求和时不需要进位，位数高的比位数低的大。（0，0，1，0 大于0，0，0，101）

example：

h1 {color: red} /*0,0,0,1*/
p em{color: purple}/*0,0,0,2*/
.grape{color: purple}/*0,0,1,0*/
*.bright{color: yellow}/*0,0,1,0*/
p.bright em.dark{color: maroon}/*0,0,2,2*/
#id216{color: blue}/*0,1,0,0*/
div#sidebar *[href]{color: silver}/*0,1,1,1*/

内联样式是指在元素的style .如 <h1 style="color:green;">The Meadow Party</h1>

内联样式的特殊性计算权重为：1,0,0,0.

如果在申明中存在!important,则其权重最大，按照该申明render。!important是指重要申明，其写法是在申明结束分号前添加!important。

继承

样式不仅会应用到当前元素，还会应用到它的后代元素，这就是继承。

继承的权重很小，虽然通配符的权重为0，0，0，0 ，继承的权重小于通配符，是最小的权重。

层叠

当特殊性相同等到的两个规则同时应用到同一个元素时，按照顺序排序。用排在最后的进行render.