選擇子項

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> 

，我需要選擇新聞1項目。我嘗試：

#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），但您在說「作爲列表項的後代的活動班的成員」（li .active）。

擺脫空間。