![精通HTML5+CSS3+JavaScript网页设计(视频教学版)(第2版)](https://wfqqreader-1252317822.image.myqcloud.com/cover/776/26846776/b_26846776.jpg)
上QQ阅读APP看书,第一时间看更新
6.5 选择器声明
使用CSS选择器可用控制HTML标记样式,其中每个选择器属性可以一次声明多个,即创建多个CSS属性修饰HTML标记。实际上也可以将选择器声明多个,并且任何形式的选择器(如标记选择器、class类别选择器、ID选择器等)都是合法的。
6.5.1 集体声明
在一个页面中,有时需要不同种类标记样式保持一致,例如需要<p>标记和<h1>标记的字体保持一致,此时可以将<p>标记和<h1>标记共同使用类选择器。除此之外,还可以使用集体声明方法。集体声明就是在声明各种CSS选择器时,如果某些选择器的风格是完全相同的或者部分相同,可以将风格相同的CSS选择器同时声明。
【例6.20】(实例文件:ch06\6.20.html)
![](https://epubservercos.yuewen.com/DBA090/15289821504504406/epubprivate/OEBPS/Images/Figure-P121_129905.jpg?sign=1739267145-ZbVKrg15HOGEVOsqbvGN6ZeKkjRmFhSP-0-c40e7151ca567e2493aa8f78ab628aab)
在IE 11.0中的浏览效果如图6-26所示。其中,网页上标题1、标题2和段落都以红色字体加粗显示,并且大小为20px。
![](https://epubservercos.yuewen.com/DBA090/15289821504504406/epubprivate/OEBPS/Images/Figure-P122_76155.jpg?sign=1739267145-r6dtFTVhiYqRp4pS9FVeaqHLAr16ZhSC-0-b9568b44c9dd377e476d5a4cc3ae8669)
图6-26 集体声明显示
6.5.2 多重嵌套声明
在CSS控制HTML标记样式时,还可以使用层层递进的方式(嵌套方式)对指定位置的HTML标记进行修饰。例如,当<p>与</p>之间包含<a></a>标记时,就可以使用这种方式对HMTL标记进行修饰。
【例6.21】(实例文件:ch06\6.21.html)
![](https://epubservercos.yuewen.com/DBA090/15289821504504406/epubprivate/OEBPS/Images/Figure-P122_129906.jpg?sign=1739267145-QmojdhUOYMZgKyeUu8LeOvmgko8porZC-0-45871f7f972949a364a26192c788f0b8)
在IE 11.0中的浏览效果如图6-27所示。其中,在段落中的超链接为红色字体,大小为30px,其原因是使用了嵌套声明。
![](https://epubservercos.yuewen.com/DBA090/15289821504504406/epubprivate/OEBPS/Images/Figure-P122_76240.jpg?sign=1739267145-utCw1ftbNWIyeAT3FpfPz66CC7azaRbd-0-36da3c7b99c0dcfc525003c66319043f)
图6-27 多重嵌套声明