CSS nth-child 1-6,7-12等

Question

我正在尝试如下设计儿童项目的样式

1,7,13等

2,8,14等

3,9,15等

4,10,16等

5,11,17等

6,12,18等

我可以用什么nth-child语法来实现这个目的？

Answer 1

您可以使用:nth-child(6n+1),:nth-child(6n+2),:nth-child(6n+3),:nth-child(6n+4)等.

参考文献:http://w3.org/TR/css3-selectors/#nth-child-pseudo,http://w3.org/TR/css3-selectors/#selectors(感谢@NayukiMinase)

此外,这里有一个很好的例子:有用:n-child Recipes - CSS-Tricks