CSS 三大特性 层叠 继承 优先级 是我们学习 CSS 必须掌握的三个特性。CSS 层叠性 所谓层叠性是指多种 CSS 样式的叠加。 是浏览器处理冲突的一个能力,如果一个属性通过两个选择器设置到同一个元素上， 那么这个时候一个属性就会将另一个属性层叠掉 比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色，此时出 现一个标签指定了相同样式不同值的情况，这就是样式冲突。 一般情况下，如果出现样式冲突，则会按照 CSS 书写的顺序，以最后的样式为准。 CSS 最后的执行口诀： 长江后浪推前浪，前浪死在沙滩上。CSS 继承性 所谓继承性是指书写 CSS 样式表时，子标签会继承父标签的某些样式，如文本颜 色和字号。想要设置一个可继承的属性，只需将它应用于父元素即可。 简单的理解就是： 子承父业。 CSS 最后的执行口诀：龙生龙，凤生凤，老鼠生的孩子会打洞。 注意： 恰当地使用继承可以简化代码，降低 CSS 样式的复杂性。子元素可以继承父元素的样式 （text-，font-，line-这些元素开头的都可以继承，以及 color 属性） 61CSS 优先级 定义 CSS 样式时，经常出现两个或更多规则应用在同一元素上，这时就会出现优 先级的问题。 在考虑权重时，初学者还需要注意一些特殊的情况，具体如下： 继承样式的权重为 0。即在嵌套结构中，不管父元素样式的权重多大，被子元素继承时， 他的权重都为 0，也就是说子元素定义的样式会覆盖继承来的样式。 行内样式优先。应用 style 属性的元素，其行内样式的权重非常高，可以理解为远大于 1 00。总之，他拥有比上面提高的选择器都大的优先级。 权重相同时，CSS 遵循就近原则。也就是说靠近元素的样式具有最大的优先级，或者说排 在最后的样式优先级最大。 CSS 定义了一个!important 命令，该命令被赋予最大的优先级。也就是说不管权重如何 以及样式位置的远近，!important 都具有最大优先级。CSS 特殊性（Specificity） 关于 CSS 权重，我们需要一套计算公式来去计算，这个就是 CSS Specificity，我们 称为 CSS 特性或称非凡性，它是一个衡量 CSS 值优先级的一个标准 具体规范入如 下： specificity 用一个四位的数 字串(CSS2 是三位)来表示，更像四个级别，值从左到 右，左面的最大，一级大于一级，数位之间没有进制，级别之间不可超越。 继承或者* 的贡献值 0,0,0,0 每个元素（标签）贡献值为 0,0,0,1 每个类，伪类贡献值为 0,0,1,0 每个 ID 贡献值为 0,1,0,0 每个行内样式贡献值 1,0,0,0 每个!important 贡献值 ∞ 无穷大 比如的例子： div ul li ------> 0,0,0,3 .nav ul li ------> 0,0,1,2 a:hover -----—> 0,0,1,1 .nav a ------> 0,0,1,1 62 #nav p -----> 0,1,0,1 注意： 数位之间没有进制 比如说： 0,0,0,5 + 0,0,0,5 =0,0,0,10 而不是 0,0, 1, 0， 所以不会存在 10 个 div 能赶上一个类选择器的情况。 总结优先级： 1. 使用了 !important 声明的规则。 2. 内嵌在 HTML 元素的 style 属性里面的声明。 3. 使用了 ID 选择器的规则。 4. 使用了类选择器、属性选择器、伪元素和伪类选择器的规则。 5. 使用了元素选择器的规则。 6. 只包含一个通用选择器的规则。 总结：权重是优先级的算法，层叠是优先级的表现
