1. 确定声明值
根据作者样式表和浏览器的默认样式表进行样式设置,将属性没有冲突的样式进行设置
2. 层叠
- 比较重要性
重要性从高到低:
带有!important的作者样式 > 带有!important的默认样式 > 作者样式 > 默认样式
- 比较特殊性
对冲突样式进行权重计算
对每个样式分别计算,选权重大的样式
样式中有对应的类型元素时加一,否则加零
| style | id | 属性 | 元素 |
|---|---|---|---|
| 内联样式 | id选择器 | 属性、类、伪类选择器 | 元素、伪元素 |
- 比较源次序
代码中书写靠后的属性会覆盖书写靠前的相同属性的属性值
3. 继承
当某个样式属性满足当前还没有确定的属性值,属性可以继承时,使用继承值当做当前属性的值
4. 使用默认值
当前面的步骤下来,属性仍然没有值时,使用属性的默认值作为当前的属性值
css的属性值说明
- initial -- 使用属性默认值
- inherit -- 使用继承值
- revert -- 使用浏览器的默认样式
- unset -- 直接走继承和默认值,对属性不做处理,自动设置属性值。当需要设置当前样式的所有属性时,使用all属性设置unset属性值。当使用all属性时,不能用于script和head标签的样式,不能通过星号设置all属性为unset,需要进行准确定位设置