CSS3第一个div只有技巧

Question

我有一堆带有一堆div的容器。我想要一个灰色的顶部边框，除了第一个应该是白色的顶部边框。我试过nth-child但我的代码中出现了一些错误。

<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。