(子选择器)在css2中被引入。 Div p{}选择Div元素的所有p个后代元素，而Div > p只选择子元素p个，而不是孙子元素、重子元素等等。

<style>
  div p{  color:red  }       /* match both p*/
  div > p{  color:blue  }    /* match only first p*/

</style>

<div>
   <p>para tag, child and decedent of p.</p>
   <ul>
       <li>
            <p>para inside list. </p>
       </li>
   </ul>
</div>

有关CSS Ce[lectors]及其使用的更多信息，请查看我的博客， CSS选择器和css3选择器

>是子组合子，有时被错误地称为直接后代组合子

这意味着选择器div > p.some_class只匹配直接嵌套在div内的.some_class段落，而不匹配在div内嵌套的任何段落。这意味着每个匹配div > p.s some_class的元素必然也匹配div p.s some_class，使用后代组合子(空格)，因此这两者经常被混淆是可以理解的。

子组合子和子组合子的比较:

Div > p.some_class { 背景:黄色; ｝ Div p.some_class { 颜色:红色; ｝ < div > <p class="some_class">Some text here</p> <!——[1]div > p.some_class, div p.some_class——> < blockquote > <p class="some_class">更多文本</p> <!——[2]div p.some_class——> . div < /引用> < / div >

哪些元素由哪些选择器匹配?

Matched by both div > p.some_class and div p.some_class This p.some_class is located directly inside the div, hence a parent-child relationship is established between both elements. Since "child" is a type of "descendant", any child element is by definition also a descendant. Therefore, both rules are applied. Matched by only div p.some_class This p.some_class is contained by a blockquote within the div, rather than the div itself. Although this p.some_class is a descendant of the div, it's not a child; it's a grandchild. Therefore, only the rule with the descendant combinator in its selector is applied.

1许多人进一步称它为“直接子元素”或“直接子元素”，但这完全没有必要(而且对我来说非常讨厌)，因为子元素从定义上讲就是直接的，所以它们的意思完全相同。没有所谓的“间接子”。

正如其他人提到的，它是一个子选择器。下面是相应的链接。

http://www.w3.org/TR/CSS2/selector.html#child-selectors

它匹配div下面的类some_class中的p个元素。

所有带有some_class类的p标记，它们是div标记的直接子标记。

<div>
    <p class="some_class">lohrem text (it will be of red color )</p>    
    <div>
        <p class="some_class">lohrem text (it will  NOT be of red color)</p> 
    </div>
    <p class="some_class">lohrem text (it will be  of red color )</p>
</div>

div > p.some_class{
    color:red;
}

所有带有.some_class的<p>的直接子元素都将获得应用于它们的样式。