css的层叠与继承

继承:

从一个元素向其后代元素传递属性值所采用的机制

例外:在body中的背景样式可以向上传递到html元素,相应的可以定义画布。

一般大多数模型属性(内外边距,边框,背景)都不能继承,这才有现实意义。

层叠:

在向一个元素运用样式时;用户代理不仅要考虑继承,还要考虑声明的特殊性以及声明本身的来源的过程。

特殊性值:

由0,0,0,0四部分组成;特殊性由左到右排序

1,0,0,0【内联样式】
0,1,0,0【id】
0,0,1,0【class,伪类,属性选择符】
0,0,0,1【元素,伪元素】
0,0,0,0【*】
结合符,继承的值:无特殊性

重要性:

将!important放置在声明的最后就形成了重要声明;在声明的其他位置,声明无效。

重要声明与非重要声明冲突时,总是重要声明胜出;重要声明的特殊性冲突会在重要声明内部解决。

层叠规则:

1.找:找出所有相关的规则。
2.初排:按显式权重对运用到该元素的所有声明排序。按来源,创作人员>读者>用户代理;重要性>非重要性。
3.再排:按特殊性对运用到该元素的所有声明排序。
4.终排:按出现顺序对运用到该元素的所有声明排序,style元素内>外部链接。对链接样式,最好按LVHA(:link,:visited,:hover,:active)的顺序来写。

tip1:在javascript中;通过DOM改变样式,就像是改变的的行内样式,具有较高的优先级,这样才能进行覆盖。

star Huang wechat
my wechat public welcomes to your attention