3.3高级特性
3.3.1CSS复合选择器
1.标签指定式选择器
标签指定式选择器又称交集选择器,由两个选择器构成,其中第一个标记选择器,第二个为class选择器或id选择器,两个选择器之间不能有空格。
例如:p.special{color:red}
2.后代选择器
后代选择器用来选择元素或元素组的后代,其写法就是外层标记写在前面,内层标记写在后面,中间用空格分隔。当标记发生嵌套时,内层标记就成为外层标记的后代。
例如:p strong { color:red;}
3.并集选择器
并集选择器是各个选择器通过逗号链接而成的,任何形式的选择器,如果某些选择器定义的样式完全相同,或部分相同,就可以利用并集选择器为它们定义相同的CSS样式。
例如:h2,h3,p{ color :red;font-size:14px;}
3.3.2CSS层叠性和继承性
1.层叠性
层叠性是指多种CSS样式的叠加。
p{ font-size :12px; font -family:"微软雅黑”;}
.special{ font-size:16px;}
#one { color:red;}
2.继承性
书写CSS样表时,子标记会继承父标记的某项样式,如文本颜色字号。设置属性是一个可继承属性,只需要将其应用于父元素即可。
并不是所有元素都可继承如下:
1.边框属性
2.外边距属性
3.内边距属性
4.背景属性
5.定位属性
6.布局属性
7.元素宽高属性
3.3.3CSS优先级
CSS代码
p {color:red;} /标记样式/
.bule {color:green;} /class样式/
#header{ color :bule;} /id样式/
HTML结构
< p id=“header” class=“bule”>< /p>
CSS为每一种基础选择器都分配了一个权重,标记选择器具有权重1,类选择器具有权重10,id选择器具有权重100。id选择器具有最大的优先级,因此文本为蓝色。
1.继承样式的权重为0,即在嵌套结构中,不管父元素样式的权重有多大,被子元素继承时,它的权重都为零,子元素定义样式会覆盖继承来的样式。
2。行内样式优先。应用style属性的元素,其行内样式的权重非常高,可以理解为远大于100,。总之。它拥有比上面提高的选择器都大的优先级。
3.权重相同时,CSS遵循就近原则。也就是说,靠近元素样式具有更大的优先级,或者说排在最后的样式优先级最大。
4.CSS定义了一个!important命令,该命令被赋予最大的优先级。也就是说不管权重如何变化以及样式位置的远近。!important都有最大优先级