参见英文答案 >
Select every Nth element in CSS4个答案我可以为每个第三列表项目样式吗?
目前在我的960px宽div我有列表的框,左侧浮动,并显示在一个3×3网格视图。它们也有一个30像素的边距,但是因为第3个第6和第9列表项有这个边距,它使它们向下跳一排,使网格显示错误
如何容易使第3和第6个没有边距 – 没有给他们一个不同的类,或者是唯一的方法呢?
解决方法
是的,你可以使用所谓的:nth-child()选择器。
在这种情况下,您将使用:
li:nth-child(3n) { // Styling for every third element here. }
:nth-child(3n):
3(0) = 0 3(1) = 3 3(2) = 6 3(3) = 9 3(4) = 12
:nth-child()在Chrome,Firefox和IE9中兼容。
对于一个工作使用:nth-child()在其他伪类/属性选择器在IE6到IE8,see this link。