CSS3第一個div唯一的技巧

Question

我有一堆divs的容器。除了第一個應該是白色的頂部邊框之外，我想要在它們上面都有灰色的頂部邊框。我嘗試了第n個孩子，但是在我的代碼中看起來有些問題。

<div class="container"> 
    <div class="row"> Stuff </div> 
    <div class="row"> Stuff </div> 
    <div class="row"> Stuff </div> 
    <div class="row"> Stuff </div> 
</div> 

.row{ border-top-width: 1px; border-top-style: solid; border-top-color: #ccc;} 
.row:nth-child1{ border-top-width: 1px; border-top-style: solid; border-top-color: #FFF;} 

Answer 1

.row { border-top: 1px solid #ccc;} 
.row:first-child { border-top-color: #FFF;} 

的jsfiddle：http://jsfiddle.net/MSDYY/

，另一個，背景設置爲紅色，表明存在實際上是在第一個元素白頂邊框：http://jsfiddle.net/MSDYY/1/

如果你想使用nth-child它應該看起來像這樣：.row:nth-child(1)

Answer 2

二者之一：

.row:nth-child(1) 

或

.row:first-of-type 

或

.row:first-child 

前兩名分別是IE9 +，但最後將在IE8中正常工作。