css - 列表中每隔一个 div 的 CSS 样式

Question

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

在一种情况下，divs 显示为列表。我无法更改 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/