子选择器和后代选择器的区别

子选择器

子选择器只能选择自己的子类,第二级元素,而不能选择第二级别以下的元素。

div > p {
 <!-- 选择 p 元素成功-->
}

div > strong {
 <!-- 选择 strong 元素失败-->
}

<div>
 <p><strong>子选择器</strong></p>
</div>


<div>
 <p><strong>子选择器</strong></p>
</div>

后代选择器

后代选择能指定的对象,只要是元素下面的元素,无论几级,都能选定。

div p {
 <!-- 选择 p 元素成功-->
}

div strong {
 <!-- 选择 strong 元素成功-->
}

<div>
 <p><strong>后代选择器</strong></p>
</div>


<div>
 <p><strong>后代选择器</strong></p>
</div>
更多教程 HTML5 教程 CSS3 教程 JavaScript 教程 JQuery 教程 React.js 教程 Node.js 教程 Koa2 教程 Python 教程 Linux 教程