第n個孩子重複

Question

夥計們，

我有100 < p>標籤，我想重複一組四色的每行中的波紋管方式。

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/