2010-12-31 2 views
1

HTML5가 들어온이 질문에 대한 변경 사항이 있습니까? Conditional alternative table row styles?HTML5의 조건부 대체 표 행 스타일

가 다른 태그에 클래스를 정의하지 않고 다른 테이블 행의 스타일을 가능 : 여기

은 원래 질문의 복사본입니다?

다음 표에서 CSS는 대체 행에 "row1/row2"클래스를 부여 할 필요없이 대체 행 스타일을 정의 할 수 있습니까? row1은 기본값이 될 수 있으므로 row2가 문제입니다.

<style> 
    .altTable td { } 
    .altTable .row2 td { background-color: #EEE; } 
    </style> 

    <table class="altTable"> 
    <thead><tr><td></td></tr></thead> 
    <tbody> 
    <tr><td></td></tr> 
    <tr class="row2"><td></td></tr> 
    <tr><td></td></tr> 
    <tr class="row2"><td></td></tr> 
    </tbody> 
    </table> 

답변

5

CSS3은 tr 태그의 "nth-child"속성을 지원합니다. 다음과 같은 뭔가 일을해야합니다 원래의 게시물에

tr:nth-child(odd) { background-color: white; } 
tr:nth-child(even) { background-color: green; } 
+0

링크 된 질문에 IE에서 작동하지 않는다고 나와 있습니다. – Budda

+0

고맙습니다. 알아두면 좋네. –

0

야곱 R의 solution 여전히 적용됩니다.

+0

하지만 저자는 "IE에서 작동하지 않습니다."..? 괜찮습니까? – Budda

+0

IE에서는 여전히 슬프게도 작동하지 않습니다. IE의 경우 교대 클래스를 계속 사용하거나 JS를 사용하여 스트라이핑을 추가해야합니다. – borkweb