选择子项目

Question

我有HTML代码：

<ul id="top_nav">
<li >
    <a href="#">
        <span>About</span>
    </a>
</li>
<li class="active">
    <a href="#"><span>News</span></a>
    <ul>
        <li class="active">
            <a href="#">
                <span>News1</span>
            </a>
        </li>
        <li>
            <a href="#">
                <span>News2</span>
            </a>
        </li>
    </ul>
</li>
<li>
    <a href="#">
        <span>Contacts</span>
    </a>
</li>

我需要选择 News1 项。我试试：

#top_nav li ul li .active a span{
    color:#ff0000;
}

但仍然没有好处。您可以自己尝试http://jsfiddle.net/dCGQ2/2/

那么有什么想法吗？

Answer 1

#top_nav li ul li.active a span

请注意.active之前没有空格。这意味着元素（在这种情况下为li）具有类active。对于空格，它表示具有类active的子元素。

Answer 2

您正在尝试匹配“作为活动类成员的列表项”（li.active），但您要说的是“作为列表项后代的活动类的成员”（{ {1}}）。

摆脱空间。