关系选择器

关系选择器

父元素：

-直接包含子元素的元素叫做父元素

子元素：

-直接被父元素包裹的元素是子元素

祖先元素：

-直接或间接包含后代元素的元素叫做祖先元素

-子元素也是后代元素

兄弟元素“

-拥有相同父元素的是兄弟元素

<body>
<div>
      我是一个div
       <p>
          我是div中的P元素
           <span>我是p元素中的span元素</span>
       </p>
       <span>我是div中的span元素</span>
       <br>
       <span>我是div中的span元素</span>
       <br>
       <span>我是div中的span元素</span>
   </div>
</body>

子元素选择器：

作用：选中指定父元素的指定子元素

语法：父元素 > 子元素

div > span{
color="颜色"
}

后代元素选择器：

作用：选中指定元素内的指定后代元素

语法：祖先 后代

div span{
   color="颜色"
}

兄弟元素选择器：

作用：选择下一个兄弟

语法：前一个 + 后一个

作用：选择下面元素所有的兄弟

语法：兄 ~ 弟

p ~ span{
   color="颜色"
}

 

posted on 2020-05-19 07:37  厌红尘  阅读(325)  评论(0)    收藏  举报

导航