Question

民间，

我有100＆lt; p为H.标签和我试图以波纹管的方式重复每一行的一组四种颜色。

RED

BLUE

GREEN

PURPLE

RED

BLUE

GREEN

PURPLE ....等等

生成的输出不是我想要的。输出是

RED

BLUE

GREEN

PURPLE

的 RED

的 GREEN

的 RED

的 PURPLE

的 GREEN

的 BLUE

的 RED

的 PURPLE

所以，如果你有任何对我有帮助的建议，那么：）

这是我的css代码。

<style>    
p:nth-child(1n) {
        background: red;
    }
    p:nth-child(2n) {
        background: blue;
    }
    p:nth-child(3n) {
        background: green;
    }
    p:nth-child(4n) {
        background: purple;
    }
</style>

Answer 1

以下CSS将为您提供所需的解决方案。

<style>    
p:nth-child(4n+1) {
        background: red;
    }
    p:nth-child(4n+2) {
        background: blue;
    }
    p:nth-child(4n+3) {
        background: green;
    }
    p:nth-child(4n+4) {
        background: purple;
    }
</style>

小提琴的简单工作示例http://jsfiddle.net/yugi47/Nwf2A/59/

nth-Child循环重复

1 个答案: