属性值的计算过程
1. 页面渲染
浏览器的页面渲染方式:
一个元素一个元素依次渲染,顺序按照页面的树形目录结构进行
即页面按照这种树形目录结构自根发散对元素依次进行渲染,元素一定是上一个渲染完后才渲染下一个元素,不会同时渲染多个元素。
渲染每个元素的前提条件:该元素的所有CSS属性必须有值。
2. 属性值的计算过程
一个元素,从所有属性都没有值,到所有属性都有值,这个计算过程,叫做CSS属性值计算过程。
具体步骤:
1.确定声明值:参考样式表(作者样式表+浏览器默认样式表)中没有冲突的声明,作为CSS属性值;
2.层叠冲突:对样式表有冲突的声明使用层叠规则,确定CSS属性值;
3.使用继承:对仍然没有值的属性,若可以继承,则继承父元素的值;
4.使用默认值:对仍然没有值的属性,使用默认值。
例子:对于a元素的color属性,浏览器的默认样式表中是有值的,所以不会继承父元素的颜色属性值。若想使该属性发生继承,则可以使用inherit强制继承,只不过此强制继承发生在层叠冲突那一步。
一些不能继承父元素的属性,可以使用inherit来强制该属性继承父元素的属性值
color: inherit;
特殊的两个CSS取值:
-
inherit
: 手动(强制)继承,将父元素的值取出应用到该元素; -
initial
: 初始值,将该属性设置为默认值。