6.Assigning property values, Cascading, and Inheritance(属性值,级联和继承)
Specified, computed, and actual values
最后的属性值有4步,先有个指定值(specified),再把它解析成能继承的值(the computer value)再把它解析成使用是的值(used name)再把根据应用环境解析成实际应用的值(actual value)
Specified values
指定值的优先级顺序:
- 如果级联有值,就用它
- 如果继承有值,并且不是文档树的根元素,就用它父元素的computer values。
- 否则就用初始值,每个元素的初始值是在定义时候决定的。
computer values
-
在级联的时候,specified value 会被处理成computer values。例如,url是绝对的单位,并且em和ex单位是被计算成像素或者是绝对的长度,计算一个值不需要浏览器渲染文档。
-
计算机不能计算的url 的绝对长度 computed value 是specialfied value
-
computer value 甚至存在在属性没有应用的时候,作为被apploes to 行的定义,然而,许多性质可能定义了computered value 依赖性值怎么应用与标签的。
used value
- 一些值尽量不在渲染的时候确定,但是如果有一些比如百分比的值,必须在文档被应用的时候才能确定。4
actual value
最后实际应用的值
inheritance
- 每一个属性都规定了是否要继承值
- 当继承时,继承的是computed value
- 如果浏览器没有那个尺寸,最后的实际值是近似的值。
- 有些值可以通过inherit来强制继承
important rule
- @important rule 优先级最高,除了 @charset rule
- @important rule 用法
- @import url(“CSS路径”) 媒体类型列表(可选) 导入外部CSS样式表
the cascade
- 样式表可能有三个来源:作者,用户和浏览器
- author:
- 作者指定样式表根据文档语言的标准,例如,在html里面,样式表可能被包括在文档或者是外部链接。
- user :
- user能够指定对每个文档特别的样式,例如,user指定了包含样式表的文件,或者浏览器可能提供接口或者界面。
- user agent
- 浏览器一致性必须应用于不符合标准的样式表里面。
- 这三个东西会根据权重交互
cascading order
级联顺序
- 如果有匹配的选择器样式,就应用
- 根据优先级升序
- user agent declarations
- user normal declarations
- author normal declarations
- author important declarations
- user important declarations
- 如果两个权重一样,那么应用后面写的
!important rules
calculating a selector ’ s specificity
- count 1 if the declaration is from is a ‘style’ attribute rather than a rule with a selector, 0 otherwise (= a) (In HTML, values of an element’s “style” attribute are style sheet rules. These rules have no selectors, so a=1, b=0, c=0, and d=0.)直接用style指定了的话,a=1,没有a=0
- count the number of ID attributes in the selector (= b)选择器包含#id的次数为b
- count the number of other attributes and pseudo-classes in the selector (= c)选择器中包含属性或者伪类的次数为c
- count the number of element names and pseudo-elements in the selector (= d)选择器包含元素名或者伪元素的个数为d的值
* {} /* a=0 b=0 c=0 d=0 -> specificity = 0,0,0,0 */
li {} /* a=0 b=0 c=0 d=1 -> specificity = 0,0,0,1 */
li:first-line {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
ul li {} /* a=0 b=0 c=0 d=2 -> specificity = 0,0,0,2 */
ul ol+li {} /* a=0 b=0 c=0 d=3 -> specificity = 0,0,0,3 */
h1 + *[rel=up]{} /* a=0 b=0 c=1 d=1 -> specificity = 0,0,1,1 */
ul ol li.red {} /* a=0 b=0 c=1 d=3 -> specificity = 0,0,1,3 */
li.red.level {} /* a=0 b=0 c=2 d=1 -> specificity = 0,0,2,1 */
#x34y {} /* a=0 b=1 c=0 d=0 -> specificity = 0,1,0,0 */
style="" /* a=1 b=0 c=0 d=0 -> specificity = 1,0,0,0 */
非css属性的表现属性的优先级
例如akign color,
UA如果至此文档中的表现属性,那么这些属性会被转换成0优先级的css规则,被看作作者定义的规则,这样他们就好共存了