CSS3 / jQuery选择器通过：nt-child（）选择器设置2行样式组

Question

我有一个<table>，每2 <tr>个

分隔数据

所以我想将行（每2行）设置为斑马线剥离样式，但每组2都应该设置样式。

我正在尝试类似的事情：

 tr:nth-child(3n+1), tr:nth-child(4n+1){background:#f7f7f7;}

我更喜欢CSS3解决方案，但如果只有jQuery可以做到这一点，那就没关系了。

请参阅demo here（可通过jsFiddle编辑）：

我尝试使用css-tricks nth-child-tester，但我无法得到它。

问题是如何斑马风格每组（2）TR（行）

Answer 1

Here是一个fork，每对行都有样式。

我必须编辑颜色才能看到任何内容。

您需要使用（4n + 1）和（4n + 2）。

Answer 2

这对你有用吗？

tbody tr:nth-child(4n+1){background:#f00;}
tbody tr:nth-child(4n+2){background:#f00;}
tbody tr:nth-child(4n+3){background:#0f0;}
tbody tr:nth-child(4n+4){background:#0f0;}

这会将成对的行换成红色和绿色。

Answer 3

其中任何一个都可行：

tr:nth-child(4n+1), tr:nth-child(4n+1)+tr {  }
tr:nth-child(4n+1), tr:nth-child(4n+2) {  }