例如:
div > p.some_class {
/* Some declarations */
}
>标志到底是什么意思？
>是子组合子，有时被错误地称为直接后代组合子。1
这意味着选择器div>； p.some_class仅选择.some_class中直接嵌套在div内的段落，而不选择任何嵌套在更远处的段落。
插图:
<div>
<p class="some_class">Some text here</p> <!-- Selected [1] -->
<blockquote>
<p class="some_class">More text here</p> <!-- Not selected [2] -->
</blockquote>
</div>
所选内容和未选内容:
>
选定
此p.some_class直接位于div内部，因此在两个元素之间建立了父子关系。
未选中
此p.some_class由div内的blockquote包含，而不是由div本身包含。 虽然这个p.some_class是div的后代，但它不是子级； 是孙子。
因此，当div>； p.some_class将不匹配此元素，div p.some_class将使用子代组合子。
1许多人进一步称它为“直接子元素”或“直接子元素”，但这完全没有必要（而且对我来说非常恼人），因为子元素根据定义是直接的，所以它们的意思是完全相同的。 没有所谓的“间接子女”。
>（大于号）是CSS组合符。
组合子解释了选择器之间的关系。
CSS选择器可以包含多个简单选择器。 在简单的选择器之间，我们可以包括一个组合器。
在CSS3中有四种不同的组合子:
注意:<在CSS选择器中无效。
例如:
<!DOCTYPE html>
<html>
<head>
<style>
div > p {
background-color: yellow;
}
</style>
</head>
<body>
<div>
<p>Paragraph 1 in the div.</p>
<p>Paragraph 2 in the div.</p>
<span><p>Paragraph 3 in the div.</p></span> <!-- not Child but Descendant -->
</div>
<p>Paragraph 4. Not in a div.</p>
<p>Paragraph 5. Not in a div.</p>
</body>
</html>
输出:
有关CSS组合符的详细信息
正如其他人提到的，它是一个子选择器。 下面是适当的链接。
http://www.w3.org/tr/css2/selector.html#子选择器
