CSS属性计算

一、指定值（Specified Value）

CSS属性的指定值通过以下三个步骤确定：

1. 如果文档的样式表给该属性指定了一个值，那么该值就是该CSS属性的指定值；
2. 如果文档的样式表没有为该属性指定任何值，那么该属性会继承父元素对应属性的值（如果有可能的话）；
3. 如果通过以上两种方式都无法确定该属性的值，就会根据CSS规范为该属性应用初始值。

二、计算值（Computed Value）

CSS属性的计算值是根据指定值计算出来的。浏览器首先会处理inherit和initial这两个特殊值，然后根据现有属性值去计算那些需要计算且能够根据现有属性值计算出来的属性的值。需要计算的值一般都是一些相对值，要把它们转化成绝对值，比如em,rem,百分比等；但在这一阶段，并不是所有属性的相对值都能够计算成绝对值的，一些与布局相关的属性，比如with,height,margin-right,text-indent,top等，当它们使用百分比值且参照元素的值也不是绝对值的时候，它们的属性值是无法计算为绝对值的，这个时候该属性的计算值与指定值一样，都是相对值。这些相对值需要等下一步布局确定之后才能转换为绝对值。

三、使用值（Used Value）

使用值是CSS属性经过所有计算之后最终得到的值。
计算任意CSS属性的使用值有三个步骤：

1. 确定指定值，指定值要么是通过层叠样式表指定，要么是通过继承得到，要么就是默认值；
2. 根据指定值得到计算值；
3. 计算布局，这时尺寸为百分比或者auto的属性值会转换成像素px，得到的结果就是使用值。