这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天，以下是我根据课程内容整理的笔记。
课堂笔记
课程重点
- CSS 选择器的特异度
- CSS 继承
- CSS 求值过程解析
笔记内容
选择器的特异度
继承
继承：继承某些属性会自动继承其父元素的计算值，除非显式指定一个值
初始值
- CSS中，每个属性都有一个初始值
- background-.color的初始值为transparent
- margin-left的初始值为0
- 可以使用initial关键字显式重置为初始值
- background-color:initial
CSS 求值过程解析
首先，CSS值需基于DOM树和样式规则来获得CSS样式，再进行求值，需要经过filtering、声明值、cascading、层叠值、defaulting、指定值、resolving、计算值、formatting、使用值、constraining、实际值
-
filtering
对应用到该页面的规则用以下条件进行筛选：选择器匹配、属性有效、符合当前media等
-
声明值
Declared Values，一个元素的某属性可能有0到多个声明值。比如：p{font-size:16px}和p.text font-size:1.2em
-
cascading
按照来源、important、选择器特异性、书写顺序等选出优先级最高的一个属性值
-
层叠值
Cascaded Value,在层叠过程中，赢得优先级比赛的那个值。比如1.2em
-
defaulting
当层叠值为空的时候，使用继承或初始值
-
指定值
Specified Value,经过cascading和defaulting之后，保证指定值一定不为空
-
resolving
将一些相对值或者关键字转化成绝对值，比如em转为pX,相对路径转为绝对路径
-
计算值
Computed Value,一般来说是，浏览器会在不进行实际布局的情况下，所能得到的最具体的值。比如60%
-
formatting
将计算值进一步转换，比如关键字、百分比等都转为绝对值
-
使用值
Used Value,进行实际布局时使用的值，不会再有相对值或关键字。比如400.2px
-
constraining
将小数像素值转为整数
-
实际值
渲染时实际生效的值，比如400px
结语
通过本次课程的学习，真的收获到了许多，以前对一些比较模糊的知识点也逐渐的清晰了起来。
