css - 使用nth-child选择一个偶数，然后是奇数个元素

Question

我正在尝试按此特定顺序设置列表项的样式:

1:白色
2:白色
3: 蓝色
4:蓝色
5: 蓝色
6:白色
7:白色
8:蓝色
9:蓝色
10:蓝色
11:白色
12: 白色

模式是[1-2][3-4-5][6-7][8-9-10]

我的 html 结构只是一个简单的列表:

<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>    

这个模式可以使用 css nth-child 吗？如果是这样，我的选择器会是什么样子？

Answer 1

尝试:

ul li:nth-child(5n),
ul li:nth-child(5n-1),
ul li:nth-child(5n-2) {
color:rgb(0,0,255);
}

ul li:nth-child(5n-3),
ul li:nth-child(5n-4) {
color:rgb(255,255,255);
}