css层叠和继承

层叠

什么选择器在层叠中胜出取决于三个因素(重要性(Importance),专用性(Specificity),源代码次序(Source order)),这些都是按重量级顺序排列的——前面的的一种会否决后一种。

1、重要性:在属性后面有‘!important’字样,把它加在属性值的后面可以使这条声明有无比强大的力量,总是优先于其他规则。由于 !important 改变了层叠正常工作的方式,所以一般最好不要用

2、专用性(特殊性):在没有使用important的情况下,是由特殊性决定到底使用哪个样式。所以重要的和重要的特殊性比较 非重要的和非重要的比较

一般有由四个值来表示:0(内联样式,即使用style该列加1分)   0(id选择器加一分)   0(类选择器 属性选择器 伪类分别加一分)   0(html元素 伪元素分别加一分),通配符加0

比较的规则:  1 0 0 0 大于 0 1 0 0大于 0 0 1 0大于0 0 0 1  

3、源代码次序:如果多个相互竞争的选择器具有相同的重要性和专用性,那么第三个因素将帮助决定哪一个规则获胜——后面的规则将战胜先前的规则;

继承

其思想是,应用于某个元素的一些属性值将由该元素的子元素继承,而有些则不会;(需要注意的是默认情况下浏览器设置链接的颜色为蓝色,而不是自然继承color属性),继承的值没有特殊性甚至连0的特殊性都没有  即在父元素中指定文本样式 子类继承如果子类设置了样式那么就会用子类的样式

控制继承:CSS为处理继承提供了三种特殊的通用属性值:(initial 和 unset 不被IE支持。)

inherit: 该值将应用到选定元素的属性值设置为与其父元素一样。
initial :该值将应用到选定元素的属性值设置为与浏览器默认样式表中该元素设置的值一样。如果浏览器默认样式表中没有设置值,并且该属性是自然继承的,那么该属性值就被设置为 inherit。
unset :该值将属性重置为其自然值,即如果属性是自然继承的,那么它就表现得像 inherit,否则就是表现得像 initial;

 

你可能感兴趣的:(css)