本章讨论特指度、继承和层叠之间的关系。
一份文档对应一个树状结构。css样式最终在元素上面怎么显示出来？多个冲突的声明作用在同个元素上，谁优先？主要从以下几个方面来看。
1.特指度
特指度根据选择符计算出来。计算特指度时，浏览器会先把一组规则打散。
像 h1 {color: white; background: black;}
会被打散成这样，以单条属性为单位：
h1 {color: white;}
h1 {background: black;}
打散后计算每句的特指度。计算规则如下：
- 行内样式加(1,0,0,0)
- 每个id加(0,1,0,0)
- 每个类属性值/属性选择/伪类增加(0,0,1,0)
- 每个元素/伪元素增加(0,0,0,1)
- 连结符和通用选择符不增加特指度
注意：id选择器和id属性的属性选择器不要混淆。比如，#xxx会贡献(0,1,0,0)特指度，而[id="xxx"]会贡献(0,0,1,0)特指度。
特指度比大小时，从高位开始比，只要有一位分出大小，后面的值不管多大都不能改变比较结果。
例如：(0,0,1,0) > (0,0,0,100)
如果样式加上了!important（即重要声明），则重要声明永远优先于不重要的声明，重要声明之间会比较特指度，不重要声明之间也会比较特指度，两类声明是分开来比较的。
2.继承
有些样式不仅会应用到元素上，还会应用到元素的后代上，这就叫继承。
继承得到的样式是没有特指度的，也就是说，即使特指度为(0,0,0,0)的声明也会打败它。
比如：
* {color: grey;}
h1 {color: black;}
然后h1里有个em元素。em元素会继承h1元素的color属性，然而这个属性会被* {color: grey;}打败。
所以，不要滥用*选择符。
3.层叠
如果两个声明的特指度相等，怎么判断优先？
后出现的声明胜出。
比如：
@import url(basic.css);
h1 {color: blue;}
则认为basic.css里的声明都出现在h1 {color: blue;}之前。
用户代理总是先确定哪些规则与某个元素匹配，然后找出所有相关的声明，然后计算它们的特指度，然后判断出哪些规则胜出，然后把胜出的规则应用到元素上，得到装饰结果。
判断顺序如下：
先分出重要声明和不重要声明
然后按来源：用户提供的重要声明>创作人员提供的重要声明>创作人员提供的不重要声明>用户提供的不重要声明>浏览器默认样式 进行排序
然后再按特指度排序
然后再按样式出现的先后顺序排序
补充：像font这样的元素也包含表现提示，这种表现提示的特指度为0，并被认为出现在创作人员编写的样式表的开头。所以它会被创作人员编写的样式覆盖，但不会被浏览器的默认样式覆盖。
