使用CSSdevise列表的每个第三项？

是否有可能为每个第三个列表项目添加样式？

目前在我的960px宽的div我有左侧浮动框，并显示在3×3网格视图中的列表。 他们也有一个30px的右边距，但是因为第三个第六和第九个列表项有这个边距，所以他们跳下去，使得网格显示错误

第三，第六，第九，如果没有给他们一个不同的class级，还有没有保证金的权利，还是唯一的办法吗？

Answer 1

是的，你可以使用所谓的“ :nth-childselect器”。

在这种情况下，您可以使用：

 li:nth-child(3n) { // Styling for every third element here. } 

：第n个孩子（3N）：

 3(0) = 0 3(1) = 3 3(2) = 6 3(3) = 9 3(4) = 12 

:nth-child()在Chrome，Firefox和IE9 +中兼容。

为了解决IE6到IE8中使用:nth-child()和其他伪类/属性select器的问题， 请参阅此链接 。

Answer 2

你可以使用:nth-childselect器

 li:nth-child(3n) { /* your rules here */ } 

Answer 3

尝试这个

 box:nth-child(3n) { ... } 

DEMO

nth-child浏览器支持

Answer 4

:nth-child是你正在寻找的答案。