css属性值的计算过程

1.首先抛出一个问题，为什么最终’a’标签渲染的颜色是蓝色。

<div><a>click</a>
</div>

div {color: 'red'
}

为什么a标签没有继承父元素的color属性？

2.先抛出一个结论：每一个元素必须拥有全部css属性并且有值浏览器才能正确渲染出元素，这个元素从无属性值到每个属性都有值为css属性的计算过程。

第一步.确认声明值：参考样式表中没有冲突的声明，作为css属性值。比如一个h1标签的开发者样式表和浏览器默认样式表进行对比，没有冲突的样式会直接作为这个元素的最终样式。

第二步.层叠冲突：多种选择器或者浏览器默认样式都选中设置的样式为层叠冲突，对于层叠冲突的处理分三步：
（1）比较重要性：开发者样式覆盖浏览器默认样式，比如使用通配符*设置margin:0后，body的默认8像素的margin就没有了。
（2）比较特殊性：选择器的权重。
（3）比较源次序：后面的覆盖前面的，比如p{color:blud,color:red} 文字颜色为红色

第三步.使用继承：对仍然没有值的属性，若可以继承（文字相关的等），则继承父元素的值，所以回到最开始的问题，a标签默认有color属性值，所以不会继承div父元素的color值

第四步.使用默认值：对于仍然没有值的属性，使用默认值

打开浏览器开发者工具，进入computed标签查看。