如何獲得第一個孩子是一個特定的元素？

Question

這個問題看起來很簡單，但我無法得到這個工作。

我有以下簡單的標記。

<div id="left_pane"> 
<ul> 
<div id="indicator"></div> 
<li>Something</li> 
<li>Something else</li> 
</ul> 
</div> 

如何從列表中選擇第一項是li元素？ （即不是div）。

我已經嘗試了許多不同的方法......這樣

#left_pane ul:first-child li { 
    /* style */ 
} 

#left_pane li:first-child { 
    /* style */ 
} 

但我似乎無法做任何事情的工作。

Answer 1

要獲取其類型的第一個元素，而不考慮其他類型的元素，通常使用:first-of-type CSS3僞類。

但在這裏，這不是有效的HTML有div作爲首位ul的孩子，所以你應該以移動內部div出來。那麼它應該是足夠使用:first-child按你的第二個規則，因爲一個ul只能有li子元素：

#left_pane li:first-child { 
    /* style */ 
}