CSS를 그들에게 다른 색상

Question

명을 제공

나는 단락의 일부 텍스트를 그래서 몇 줄의 텍스트가있을 것입니다. 텍스트의 나머지 부분은 (간단한 오버플로에 의해) 숨겨집니다.

문제는 렌더링 된 텍스트의 모든 줄에 다른 색상을 지정해야한다는 것입니다. CSS3/HTML5를 사용하면 어떨까요?

나는 CSS 카운터에 대해 생각해 보았지만 그 값을 매개 변수로 사용할 수 없습니다 ("content"속성 제외).

필자는 첫 번째 줄처럼 의사 클래스와 같은 것이 필요하지만 n 번째 줄을 얻는 데있어 posibility가 필요하다고 생각합니다.

JS에서 몇 줄의 코드로이 작업을 수행 할 수 있다는 것을 알고 있지만 사용할 수는 없습니다.

도움 주셔서 감사합니다.

Answer 1

불행히도 순수 CSS에서는 불가능합니다.
이 http://jsfiddle.net/QM52C/1/

그러나 하나의 <p> 태그 지정과 함께, 그것은 현재 날짜로 단순히 불가능 :

나는 여러 <p> -Tags와 귀하의 요구 사항을 달성 할 수있는 방법을 알아 냈어.

Answer 2

나는 의사 태그로 영리 해 보려고했지만 예상대로 나오지 않았다. 아마도 어쨌든 : before 및 : after 텍스트 세그먼트를 원본과 정렬 시키면 작동 할 수 있습니다.

#container p:before { 
color: red; 
display:inline !important; 
content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.                                  Suspendisse sed viverra turpis.                                                                 "; 
} 
#container p { 
color:white; 
font-family:monospace; 
} 
#container p:after { 
color: green; 
content: "                                                         Phasellus sit amet nulla tellus.                                 Duis mollis, dolor vitae aliquam interdum, mauris mi ornare diam"; 
} 

FIDDLE

그렇지 않으면, 난 정말 자바 스크립트없이 가능하다고 생각하지 않습니다.