在CSS中当几个相同的选择器对同一个元素有不同的规则时，该怎么应用这些规则呢？
答案就是：CSS特殊性（CSS specificity）
选择器特殊性有选择器本身组成，特殊性由4个数值表述：0， 0， 0， 0，具体特殊性如下：
- 对于内联样式声明的特殊性时，加1， 0， 0， 0
- 对于选择器中有给定的ID属性值时，加0， 1， 0， 0
- 对于选择器中有给定的类属性值、属性选择或伪类，加0， 0， 1， 0
- 对于选择器中有各个给定的元素和伪元素时，加0， 0， 0， 1
- 结合符和通配符对特殊性没有任何贡献即0， 0， 0， 0
从左到右，属性权重越来越低，1，0，0，0大于任何第一个0开头的特殊值如0，0，0，13
特殊值实例： #id /*0,1,0,0*/ .className {} /*0,0,1,0*/ [attr] /*0,0,1,0*/ [attr="value"] /*0,0,1,0*/ element {} /*0,0,0,1*/ h1{} /*0,0,0,1*/
html > body td[id="totals"] tr ul > li {声明} /*0,0,1,5*/ li#answer {声明} /*0,1,0,1*/ (winner) h1#selec{声明} /*0,1,0,1*/ <h1 style="color: red">element</h1> /*1,0,0,0*/ (winner) 内联样式特殊性最高
重要性：
某个样式声明非常重要，可以在声明的结束分号之前加上！important来标志。
p.class {color: #222 !important} /*winner*/ #id {color: #333首先，！important必须放到声明最后的分号之前，其次加了！important的声明与非重要声明分开考虑，
且声明冲突时，胜出的总是重要声明。
继承
继承没有特殊性
*color｛color: red｝ h1#page-title {color: green} <h1 id="page-title">out em<em>in em</em>out em</h1> 结果： out em in em out em通配选择符具有0特殊性，而继承无特殊性，所以em内为绿色
层叠
如果元素选择符的特殊性相同：
- 按照！important来排序： 读者的重要声明 > 创作人员的重要声明 > 创作人员的正常声明 > 读者正常声明 > 用户代理声明
- 按照特殊性排序，较高的特殊性权重大于低的权重
- 按照出现顺序，后出现的权重大，样式表中的导入样式表在前，主样式表在后。
正式由于这种顺序，才有了LOVE HA，一般链接样式按顺序link-visited-hover-active。（LVHA）来排序。
:link {} :visited {} :hover {} :active {}因为有相同的特殊性，0，0，1，0。所以与元素匹配的最后一个选择器才会胜出。
假如不按照常用的顺序 :active {} :hover {} :link {} :visited {}一个链接的link和visited两种样式肯定有一种会匹配，所以:active和:hover会被覆盖。
:link {} :hover {} :visited {} :active {} 这个顺序下，被访问过的样式都不会有 :hover 样式，因为会被:visited覆盖。 也可以把伪类链接起来，所以可不必担心这些问题 :link {} :visited {} :link :hover {} :visited :hover {} 每个规则都有唯一的链接状态所以不会冲突。