CSS选择：如何风格项目[1-2] [5-6] [9-10]等通过对(CSS selector: h

我有一个项目清单，我想组的两个，与团体之间交替的风格样式。 所以项目[1-2] [5-6] [9-10]可能是{ background-color: #C0C0C0 ;}而[3-4] [7-8] [11-12] ...可能是{ background-color: #FFF ;}

对于这样的结果：

1. 灰色
2. 灰色
3. 黑色
4. 黑色
5. 灰色
6. 灰色
7. 黑色
8. 黑色
9. 灰色
10. 灰色
11. 黑色
12. 黑色
13. ...

我应该使用哪种CSS第n个孩子的公式？

Answer 1:

工作的jsfiddle这里。

---

用途:nth-child(4n+3), :nth-child(4n+4)

CSS：

li:nth-child(4n+4), li:nth-child(4n+3) {
  color:red;
}

HTML：

<ul>
    <li>No</li>
    <li>No</li>
    <li>YES</li>
    <li>YES</li>
    <li>No</li>
    <li>No</li>
    <li>YES</li>
    <li>YES</li>
    <li>No</li>
    <li>No</li>
    <li>YES</li>
    <li>YES</li>
</ul>

Answer 2:

你可以用2个选择实现这一目标

:nth-child(4n),:nth-child(4n-1){font-weight:bold}

http://jsfiddle.net/mckm4/

Answer 3:

li:nth-child(4n+1), li:nth-child(4n+2) {
    background-color: #C0C0C0
}

li:nth-child(4n+3), li:nth-child(4n) {
    background-color: #FFF
}

这不是特别优雅，但它应该服务。

文章来源: CSS selector: how to style items [1-2][5-6][9-10] etc by pair