Css nth-child工作奇怪

Question

我尝试制作条纹表。但是当我尝试使用nth-child时，它确实很奇怪

模板：

...
<tr class="striped">...</tr>
<tr class="more">...</tr>
...

的CSS：

tr.striped:nth-child(odd) {
    background-color : rgba($mainColor, .1);
}

但所有条纹类的tr都是彩色的。也许我错过了规范的一些特征？

Answer 1

使用它：

tr:nth-child(4n+1)

而不是：

tr.striped:nth-child(odd)

演示：https://jsfiddle.net/sabeti05/epnjn1wo/