CSS - 目標與類

Question

HTML的第一個元素：

<p class=menu_top>Title</p> 
<p class=menu_top>Order</p> 
<p class=menu_top>Position</p> 
<p class=menu_top>Number</p> 

我怎麼能只指定的第一個元素？

Answer 1

使用:first-child僞類。

.menu_top:first-child { 
    your: rules; 
} 

http://jsfiddle.net/uKJcK/1/

Answer 2

正如注意點，你的結構化將會給你帶來更多的工作在未來，以及方式。這將是更好的選擇是這樣的：

<div class="menu_top"> 
    <p>Title</p> 
    <p>Order</p> 
    <p>Position</p> 
    <p>Number</p> 
</div> 

（多語義正確將使其成爲一個無序列表） 重複是沒有必要的，當你可以簡單的規格書CSS像這樣：

.menu_top p { 
    //all my basic styles for each menu item 
} 

.menu_top p:first-child { 
    // specific styles for just the first menu item 
} 

過度分類會導致未來的返工負載，並使代碼混亂。使用級聯對您有利;它減少了重複的代碼，並且更容易僅覆蓋異常值。