css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器
程序员文章站
2024-01-01 19:13:10
高级选择器: 后代选择器 子代选择器 并集选择器 交集选择器 一、后代选择器: 使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子) 也就是说,box类下的所有span标签 字体颜色都被设置为了红色 二、子代选择器: 使用>表示子代选择器. 之选中box类下第一层的span标签设置为红色 ......
高级选择器:
- 后代选择器
- 子代选择器
- 并集选择器
- 交集选择器
一、后代选择器:
使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子)
也就是说,box类下的所有span标签 字体颜色都被设置为了红色
.box span{ color:red; }
二、子代选择器:
使用>表示子代选择器. 之选中box类下第一层的span标签设置为红色
.box>span{ color:red; }
三、并集选择器:
多个选择器之间用逗号隔开,表示选中页面中的多个标签, 一些共性的元素可以使用并集选择器
所有的div和a中的字体同时被设置成了红色,
div,a{ color:red; }
四、交集选择器:
使用交集选择器,第一项必须是标签选择器,第二项必须是类选择器 比如:
在所有div中选中类名为active的div并设置背景颜色为红色.
div.active{ background-color:red; }
推荐阅读
-
css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器
-
五千字长文-css3选择器基础最详解(讲述其核心特点)(下次更新的是选择器高级)
-
python 之 前端开发(基本选择器、组合选择器、 交集与并集选择器、序列选择器、属性选择器、伪类选择器、伪元素选择器)
-
100求解奇怪的CSS后代选择器问题_html/css_WEB-ITnose
-
CSS高级选择器的详解
-
CSS高级选择器的详解
-
使用CSS的类名交集复合选择器_html/css_WEB-ITnose
-
CSS的后代选择器基础使用示例详解
-
五千字长文-css3选择器基础最详解(讲述其核心特点)(下次更新的是选择器高级)
-
CSS的后代选择器基础使用示例详解