css n-child（）检查电路板图案

想象一下有一个四列n行的网格。第二个元素的颜色应该与另一个不同。有点像，但只有四列

---

我需要一个单亲家长，其中有显示：flex的。我尝试调整链接的示例，但无法使其正常工作。

这非常简单，因为模式重复了2行4行，您只需将样式应用于网纹模式的8n+I即可：

.flex{ 显示器：flex； 宽度：400px；/*四个正方形的宽度*/ 弯曲方向：行； 柔性包装：包装； } .广场{ 宽度：100px； 高度：100px； 边框：1px纯黑； 框大小：边框框； } .square:n-child8n+1， .square:n-child8n+3， .square:n-child8n+6， .square:n-child8n+8{ 背景：黑色； } .square:n-child8n+2， .square:n-child8n+4， .正方形：N-child8n+5， .square:n-child8n+7{ 背景：白色； }

---

向我们展示您的尝试。想象一下有一个四列n行的网格->如果我们没有很好的想象力怎么办：