CSS的第一直接子只

Question

我有以下HTML結構：

<div class="nav-collapse"> 
       <ul class="nav"> 

       </ul> 

       <ul id="registerCart" class="nav pull-right"> 

       </ul> 

</div> 

，我想下面的規則只適用於第一導航，所以我所做的：

.nav-collapse > .nav { 
    left: 135px; 
} 

然而，這也適用於registerCart。我如何僅將這個應用於第一個導航？如果你有多個嵌套.nav元素

.nav-collapse .nav:first-child {} 

您可以直接孩子選擇結合起來：

Answer 1

使用的第一個孩子選擇。

.nav-collapse > .nav:first-child {} 

Answer 2

>操作符意味着它將只選擇匹配的孩子，是直接孩子的父母所定義的（這樣一個深層次），而不是從定義父各級所有兒童匹配。

使用：第一個孩子完全可以，但是當涉及動態內容時，IE7和IE8會出現一些問題。有關已知問題，請參閱http://www.quirksmode.org/css/selectors。如有疑問，請通過它的class或id屬性選擇第一個孩子。