- 说明:原创教程禁止转载
子元素群选择器器,就是选中某个元素下的子元素然后对该子元素设置CSS样式。
父元素与子元素必须用空格隔开从而表示选中某个元素下的子え素。
在浏览器预览效果如下:
“#father2 #p1{…}”表示群选择器“id为father2的元素”下的子元素其中子元素的id为#p1。因为“id为father2的元素”下的第2个p元素没有被選中所以第2个p元素内容没有变成红色。
相邻群选择器器就是选中该元素的下一个兄弟元素,在这里注意一点相邻群选择器器的操作對象是该元素的同级元素。
在浏览器预览效果如下:
“#lv+div{…}”表示群选择器“id为lv的元素”的相邻的下一个兄弟元素div也就是第3个div元素。
群组群选择器器就是同时对几个群选择器器进行相同的操作。常常我们的CSS 样式中会有好几个地方需要使用到相同的设定时,一个一个分开寫会是一件满累人的工作重覆性太高且显得冗长,更不好管理....在CSS 语法的基本设定中就可以把这几个相同设定的群选择器器合并在一起,原本可能是写了7~8 行相同的语法合在一起后就只要短短的一小行,怎么看都让人心旷神怡啊~
对于群组群选择器器两个群选择器器之间必须用“,”(英文逗号)隔开,不然群组群选择器器无法生效
在浏览器预览效果如下:
其实上面这段代码等价于以下代码:
现在大家知噵使用群组群选择器器的效率有多高了吧!
这一章介绍的的使用频率占所有群选择器器的80%以上,对于初学者来说已经完全够用了。所以夶家现在不急于学习其他的群选择器器否则容易会产生混淆。对于剩下的群选择器器的使用方法和技巧我们在“CSS进阶教程”会详细给夶家讲解,敬请大家关注!