CSS中的">"是什么意思？

Question

可能重复:
CSS规则中的">"是什么意思？

什么是>符号CSS是什么意思？我在我的Wordpress博客主题中注意到它,并想知道它在做什么.

#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
    background: #efefef;
}
#access li:hover > a,
#access a:focus {
    background: #f9f9f9; /* Show a solid color for older browsers */
    background: -moz-linear-gradient(#f9f9f9, #e5e5e5);
    background: -o-linear-gradient(#f9f9f9, #e5e5e5);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9f9f9), to(#e5e5e5)); /* Older webkit syntax */
    background: -webkit-linear-gradient(#f9f9f9, #e5e5e5);
    color: #373737;
}
#access ul li:hover > ul {
    display: block;
}

Answer 1

例如,它意味着只有"第一个嵌套"元素将被定位("子"元素)

   <div id="a">
       <div id="b">
         <div id="c">
       </div>
      </div>
    </div>

如果你写

#a div{
 background: red;
}

然后#b和#c都是红色的,但如果你使用>喜欢

#a > div{
 background: red;
}

那么#b只会是红色,而#c则不会.

Answer 2

这是一个子选择器(也称为子组合器).您可以在万维网联盟(W3C)的网站上找到有关选择器的更多信息,您可以在其中阅读子选择器上的CSS2条目, 或者您可以直接跳到子选择器上的CSS3条目.

此外,这是一个关于CSS Child vs Descendant选择器的另一个SO问题的一个很好的引用:

试想一下英文中"孩子"和"后代"的含义:

• 我的女儿既是我的孩子,也是我的后代

• 我的孙女不是我的孩子,但她是我的后代.