CSS'>'选择器；它是什么？

>

选择直系子女

例如，如果您有这样的嵌套div：

<div >    <div >        <div >...</div>    </div>    <div >        <div >...</div>    </div></div>

然后在样式表中声明css规则，如下所示：

.outer > div {    ...}

您的规则仅适用于具有“中级”类的div，因为这些div是元素为“外部”类的元素的直接后代（直接子代）（当然，除非您声明其他更具体的规则来覆盖这些规则）
。见小提琴。

div {  border: 1px solid black;  padding: 10px;}.outer > div {  border: 1px solid orange;}<div >  div.outer - This is the parent.  <div >    div.middle - This is an immediate child of "outer". This will receive the orange border.    <div >div.inner - This is an immediate child of "middle". This will not receive the orange border.</div>  </div>  <div >    div.middle - This is an immediate child of "outer". This will receive the orange border.    <div >div.inner - This is an immediate child of "middle". This will not receive the orange border.</div>  </div></div><p>Without Words</p><div >  <div >    <div >...</div>  </div>  <div >    <div >...</div>  </div></div>

边注

如果您

`在选择器之间使用空格代替

，则您的规则将同时应用于两个嵌套div。该空间更为常用，并定义了“后代选择器”，这意味着它将在树上查找任何匹配的元素，而不是像dos那样直接查找子元素

注意：

>

如果你正在寻找进入孔，使用较少的CSS选择器，你可能也想看看

+

~

[attr]

此页面包含所有可用选择器的完整列表，以及各种浏览器（主要是IE出现问题）对它们的支持的详细信息，以及它们的用法示例。