继承是指把一个元素的某些属性值传递给后代的机制。确定应该把哪些值应用到元素上时，用户代理不进要考虑继承，还要考虑声明的特指度，以及声明的来源。这个过程称为层叠。
1、特指度：同一元素可能被多个选择器匹配，当多个选择器中有相同规则时，最终使用哪个选择器的规则，需要用到特指度。
选择符的特指度由选择符本身的组成部分决定。一个特指度值由四个部分构成，例如 0， 0， 0， 0选择符的特指度通过下述规则确定：
a、选择符中的每个 ID 属性值加 0， 1， 0， 0。
b、选择符中的每个类属性值，属性选择或伪类加 0， 0， 1， 0。
c、选择符中的每个元素和伪类元素加 0， 0， 0， 1。
d、连结符和通用选择符不增加特指度。
如：h1 {color： red;} /* 特指度 = 0， 0， 0， 1 */
p em {color: purple;} /* 特指度 = 0， 0， 0， 2 */
特指度1,0,0,0比所有以0开头的特指度大。同理，0，1，0，0 大于0，0，1，7。
2、声明和特指度
选择符的特指度确定之后，其值将赋予关联的每个声明。为了计算特指度，用户代理必须把规则“打散”成单独的规则。
在任何情况下，用户代理都会确定哪些规则与元素匹配，然后找出所有相关的声明，计算格子的特指度，判断哪些规则胜出，再把胜出的规则应用到元素上，得到装饰后的结果。每个元素、选择符、和声明都要精力这一系列操作。这个行为是层叠的重要部分。
3、通用选择符的特指度
是0,0,0,0，即不增加特指度，链接符没有特指度，不是0,0,0,0.而是没有。
4、ID 选择符和 id 属性选择符之间在特指度上是有区别的 。属性与类是同一特指度。
5、行内样式的特指度
目前见到的特指度都以零开头，因此你可能在想，那一位为什么要存在呢？存在必定有用。那一位是为行内样式声明保留的，行内样式声明的特指度比其他声明高。<h1 style="color: red;">我歌且谣</h1>
6、重要性
有时候某个声明可能非常重要，超过其他所有声明， CSS 称之为重要声明。这种声明要在声明末尾的分号之前插入 !important 。
例如： p.dark {color: #333 !important ; } !important 的位置必须正确，否则声明将失效。
带有 !important 的声明对特指度没有影响，但是会与不重要的声明分开处理。其实，所有带 !import 的声明会放在一起，而特指度冲突就在这个范围内解决。同样，重要的声明作为一个整体，其中的冲突使用特指度解决。因此，重要声明和非重要声明冲突时，重要声明始终胜出。
7、继承
特指度对理解声明是如何应用到文档上的很重要，此外，还有一个重要的概念，即继承。继承指某些样式不仅应用到所指的元素上，还应用到元素的后代上。
样式绝不会向上传播，即元素的样式绝不传给祖辈元素。
很多盒模型属性是不继承的，包括外边距，内边距，背景和边框。继承的值没有特指度，连零都没有。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{color: gray;}
h1#page-title{color: black;}
</style>
</head>
<body>
<h1 id="page-title">终结继承<em>继承</em></h1>
<p>因为通用选择符应用于全部元素，而且特指度为零，
所以它声明的颜色 gray 击败继承的颜色 black （由于继承的值根本没有特指度）。
因此，em元素渲染为灰色，而不是黑色
</p>
</body>
</html>
8、层叠
如果两个特指度相等的规则应用到同一个元素上会发生什么？CSS才用层叠机制把样式组合在一起，即结合继承和特指度的一些规则。
CSS的层叠规则如下：
a、找到匹配特定元素的所有规则。
b、按显示权重排序应用到特定元素上的所有声明。以 !important 标记的规则比没有这一标记的权重高。
c、按来源排序引用到特定元素上的所有声明。声明由三个来源：创作人员、读者和用户代理。正常情况下，创作人员编写的样式击败读者提供的样式；
读者样式中以 !important 标记的声明比其他样式权重高，包括创作人员编写的样式中以 !important 标记的声明比其他样式权重高，
包括创作人员编写的样式中以 !important 标记的声明；创作人员和读者样式覆盖用户代理的默认样式。
d、按特指度排序应用到特定元素上的所有声明。特指度高的声明具有较高的权重。
e、按声明的前后位置排序应用到特定元素上的所有声明。样式表或文档中靠后的声明权重较高。到如的样式表中的声明放在当前样式表中所有声明的前面。
总结：
在找到特定元素的所有规则后，对显示权重、来源、特指度、声明的前后顺序进行一 一比较，直到得出结果。
在声明的权重上，基本要考虑五个方面。下面按权重从高到低列出：
- 读者提供的样式中以 !important 标记的声明。
- 创作人员编写的样式中以 !important 标记的声明。
- 创作人员编写的常规声明。
- 读者提供的常规声明。
- 用户代理的默认声明。
创作人员通常只需考虑钱四点。
当元素的各声明的显示权重和来源相同，那么按照特指度排序。
如果特指度也相同，那么在样式表中的位置靠后的规则胜出。
标签：层叠,--,important,元素,特指,样式,选择符,声明,CSS From： https://www.cnblogs.com/wgqy/p/17063930.html