모든 다섯 번째 div의 색상 변경

Question

나는 각 div에 서로 다른 div가 여러 개 있습니다. 네 번째 자식 선택기를 사용하여 모든 네 번째 div의 채우기를 변경합니다.

이제 롤오버 속성을 매 5 번째로 변경하고 싶습니다. 이 같은

뭔가 :

.content_tab_hover:nth-child(5n+1){ 
    background: #ce1c5e; 
} 
.content_tab_hover:nth-child(5n+2){ 
    background: #009acf; 
} 
.content_tab_hover:nth-child(5n+3){ 
    background: #fcc712; 
} 
.content_tab_hover:nth-child(5n+4){ 
    background: #742f68; 
} 
.content_tab_hover:nth-child(5n+5){ 
    background: #389a28; 
} 

바이올린 : http://jsfiddle.net/craigzilla/TuRzD/

내가 잘못 갈거야 어떤 아이디어가?

Answer 1

올바른 DIV를 타겟팅하지 않습니다. 이 같아야

.content_tab:nth-child(5n+1) .content_tab_hover{ 
    background: #ce1c5e; 
} 
.content_tab:nth-child(5n+2) .content_tab_hover{ 
    background: #009acf; 
} 
.content_tab:nth-child(5n+3) .content_tab_hover{ 
    background: #fcc712; 
} 
.content_tab:nth-child(5n+4) .content_tab_hover{ 
    background: #742f68; 
} 
.content_tab:nth-child(5n+5) .content_tab_hover{ 
    background: #389a28; 
} 

.content_tab_hover:nth-child(n) 각 .overlay DIV에서 n 번째 .content_tab_hover 요소를 선택한다.

Answer 2

선택기를 변경해야합니다.

.content_tab:nth-child(5n+1) .content_tab_hover{ 
    background: #ce1c5e; 
} 
.content_tab:nth-child(5n+2) .content_tab_hover{ 
    background: #009acf; 
} 
.content_tab:nth-child(5n+3) .content_tab_hover{ 
    background: #fcc712; 
} 
.content_tab:nth-child(5n+4) .content_tab_hover{ 
    background: #742f68; 
} 
.content_tab:nth-child(5n+5) .content_tab_hover{ 
    background: #389a28; 
} 

업데이트 jsfiddle : http://jsfiddle.net/TuRzD/6/

.content_tab:nth-child() .content_tab_hover 대신

.content_tab_hover:nth-child()...의 것은이 시도에 n 번째 아이는해야한다