列表中每隔二个div的CSS样式

Question

我的网站上有div个框。每隔一个框应该有另一种颜色的边框。

在一种情况下，div显示为列表。我无法更改HTML代码，因为它是自动生成的。在我的网站的其他部分，我做这样的样式，它的工作原理：

.displayBlogpost:nth-child(2n+1) {
    border: #B4C556 1px solid;
}

但ol不再适用。我不知道如何访问每一秒.displayBlogpost-div。这是我的代码：http://jsfiddle.net/8SbbL/

Answer 1

使用你需要的第n个孩子将它应用到列表项

http://jsfiddle.net/8SbbL/6/

您还可以使用nth-child(even)和nth-child(odd)，其内容比2n-1

更好

Answer 2

元素在li中，因此它始终是第一个和最后一个元素。在实际的li上使用第n个子技巧。

#searchresult li:nth-child(2n+1) .displayBlogpost {
    border: #B4C556 1px solid;
}

工作分叉：http://jsfiddle.net/FJuzm/