CSS3 열의 n 번째 자식

Question

저는 CSS3 columns을 사용하고 있지만 각 열을 개별적으로 제어하여 짝수/홀수 열을 다른 배경으로 설정하려고합니다.

나는 결과가이 그림에 표시하려면 :

HTML 콘텐츠 :

<div id="content"> 
    content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
    content body text content body text content body text content body text 
</div> 

CSS는 : 뭔가를 사용하려면

#content { 
    column-gap:25px; 
    column-count:3; 
} 

like :

column:nth-child(even) 
{ 
    background:#0000ff; 
} 

CSS3 :nth-child 속성을 사용할 수 있습니까? 아니면 모든 개별 열의 선택기를 얻을 자바 스크립트 솔루션을 사용할 수 있습니까?

제안 된 해결책을 제공해주십시오.

는

뭔가 이런 식으로 ..

Answer 1

는 스타일링 된 절대 위치가 배경 블록을 추가 사전에 감사합니다 내가 할 수있는 방법이

#bg1 { 
    position: absolute; 
    width:30%; 
    height:100%; 
    background-color:green; 
    z-index:-1; 
} 

Fiddle