关于css的nth-child,怎么循环12345之类的

问个问题,这个能用css实现么。
nth-child(1),nth-child(2),nth-child(3)……
我想做成6个不同颜色一直循环来着,也就是第七个开始也是蓝开始。

图片描述

图片描述

阅读 5.1k
3 个回答

如果是这样的话,就没有必要使用nth-child了,直接写6个class

新手上路,请多包涵

这种应该写6个class然后用js把这些class插入循环的html tag里比较方便吧

li:nth-child(6n+1){
            color: #f00;
        }
        li:nth-child(6n+2){
            color: #f90;
        }
        li:nth-child(6n+3){
            color: #ccc;
        }
        li:nth-child(6n+4){
            color: royalblue;
        }
        li:nth-child(6n+5){
            color: #ccc;
        }
        li:nth-child(6n+6){
            color: aqua;
        }
推荐问题