css层级选择器包含哪些

层级选择器是CSS中一种常用的选择器，通过指定元素的层级关系来选择其样式。它包含以下几种形式：

selector1 selector2 {
 ... }
      /* 后代选择器 */selector1 >
 selector2 {
 ... }
 /* 子元素选择器 */selector1 + selector2 {
 ... }
 /* 相邻兄弟选择器 */selector1 ~ selector2 {
 ... }
 /* 兄弟选择器 */

1. 后代选择器：选择符合一定祖先元素的后代元素。例如：

div p {
     color: red;
 }
    

表示选择在div元素内的所有p元素，并将其颜色设为红色。

2. 子元素选择器：选择符合一定父元素的直接子元素。例如：

div >
 p {
     color: red;
 }

表示选择在div元素内的直接子元素p，并将其颜色设为红色。

3. 相邻兄弟选择器：选择与当前元素相邻的下一个兄弟元素。例如：

p + span {
     color: red;
 }

表示选择在p元素后面的第一个兄弟元素span，并将其颜色设为红色。

4. 兄弟选择器：选择与当前元素后面的所有兄弟元素。例如：

p ~ span {
     color: red;
 }
    

表示选择在p元素后面的所有兄弟元素span，并将其颜色设为红色。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！