jquery - nth-child 影响 3 个输入组

Question

我有一个处理课程申请的输入表单，它会根据申请人的数量动态添加额外的输入 - 每个申请人填写他们的姓名、电子邮件和电话号码。因此，如果用户选择了 2 个申请人，则表单会在默认的 3 个输入之后添加 3 个新输入，依此类推。

我想通过交替每组三个输入的背景颜色来提高表单的可用性，例如前三个是灰色，接下来三个是白色，接下来三个是灰色等。

我想我可以用 nth-child 做到这一点，但我不知道怎么做。输入在它们自己的 div 中，因此很容易影响它们，我只是不知道在第 n 个子括号中放置什么来实现它。

Answer 1

div:nth-child(6n),
div:nth-child(6n-1),
div:nth-child(6n-2){
    background-color: red;
}

http://jsfiddle.net/bmMjm/

Answer 2

你正在做一个每 6 个项目重复一次的模式。因此，您需要基于:nth-child(6n). 不幸的是，这有点冗长......

input:nth-child(6n+1), input:nth-child(6n+2), input:nth-child(6n+3) {
    background: white;
}
input:nth-child(6n+4), input:nth-child(6n+5), input:nth-child(6n) {
    background: lightgrey;
}

jsFiddle

显然默认是white，所以第一个块严格来说不是必需的。