是否可以使用纯 CSS 创建一个每 4 个项目交替的颜色网格。例如;前 4 个项目为蓝色，接下来的 4 个为红色，然后接下来的 4 个项目为蓝色，依此类推。
<div>Item 1 = blue</div>
<div>Item 2 = blue</div>
<div>Item 3 = blue</div>
<div>Item 4 = blue</div>
<div>Item 5 = red</div>
<div>Item 6 = red</div>
<div>Item 7 = red</div>
<div>Item 8 = red</div>
<div>Item 9 = blue</div>
有任何想法吗？我知道有nth-child(odd) and even但不确定这有帮助吗......
对红色使用默认规则，对蓝色使用带有偏移量的重复规则是可能的。
语法为8n+1每 8 偏移 1，然后重复此操作以获得 1 到 4。
div {
color: red;
}
div:nth-child(8n+1),
div:nth-child(8n+2),
div:nth-child(8n+3),
div:nth-child(8n+4) {
color: blue;
}
<div>Item 1 = blue</div>
<div>Item 2 = blue</div>
<div>Item 3 = blue</div>
<div>Item 4 = blue</div>
<div>Item 5 = red</div>
<div>Item 6 = red</div>
<div>Item 7 = red</div>
<div>Item 8 = red</div>
<div>Item 9 = blue</div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
