CSS样式之层叠 ------ 2020-01-16

1、样式的分类：

/**
1、作者样式表：开发者写的样式；
2、浏览器默认样式表中的样式；
*/

2、声明冲突：

// 声明冲突：指的是一个元素多次应用了同一个样式；

3、层叠：

// 层叠：解决声明冲突的过程，浏览器自动处理（权重计算）；

4、层叠的三个过程：

/**
1、比较重要性；
2、比较特殊性；
3、比较源次序；
*/

5、比较重要性：

/**
按照重要程度来比较重要性：
（1）作者样式表中的 !important重要性最高；
（2）作者样式表中的普通样式重要性次之；
（3）浏览器默认样式表中的样式重要性最低；
*/

6、比较特殊性：

/**
比较特殊性就是计算每个应用的样式属性的权重，计算规则是根据应用样式属性的选择器，计算出这个样式属性的一个4位数的权重，
比较这个4位数的权重，权重高的样式属性胜出：
1、千位：如果是内联样式，记1，否则是0；
2、百位：等于选择其中所有id选择器的数量，而且是逢256进1；
3、十位：等于选择器中所有类选择器、属性选择器、伪类选择器的数量，也是逢256进1；
4、个位：等于选择器中所有元素选择器、伪元素选择器的数量，也是逢256进1；
*/

7、比较源次序：

/**
当以上两种都没有确定应用哪个样式属性时，就会比较源次序了，书写靠后的胜出；
*/