2012-03-06 3 views
0

현재 생성 할 수있는 2 개의 행 대신 테이블 행의 3 가지 색상을 번갈아 사용할 수있는 방법이 필요합니다.3 가지 배경이있는 행 색상이 번갈아 표시됩니다.

<style type="text/css"> 
    tr.d0 td { 
     background-color: #FFFFFF; color: black; 

    } 
    tr.d1 td { 
     background-color: rgba(79, 129, 128, .2); color: black; 

    } 
    tr.d2 td { 
     background-color: rgba(119, 149, 60, .2); color: black; 

    } 
    </style> 

for($i =0; $i ...){ 

$rowclass = 0; 
<tr class="d<?php echo $rowclass; ?>"> 

</tr> 

$rowclass = 1 - $rowclass; 

} 

답변

2
$rowclass = (1 + $rowclass) % 3; 

또는 더 나은, 그 스크랩 그냥 대신

$i % 3 

를 사용합니다.

+0

도움을 주셔서 감사합니다! 카운터를 0으로 시작할 때 처음 두 행이 모두 0을 반환 했으므로이 ($ i + 1) % 3으로 수정했습니다. –

0

당신은 modulo 연산자를 찾고 있습니다. PHP (대부분의 C 스타일 언어)에서는 %이고, 나머지 숫자는 나누어 줄 것입니다. 이 경우이 같은 각 행에 대한 클래스 이름을 구성하는 데 사용할 수 있습니다 :

for ($i=0; $i < $max, $i++) { 
    $className = 'd' . ($i % 3); 

    echo '<tr class="' . $className . '">'; 
    // do something with the row 
    echo '</tr>'; 
} 
3

는 CSS3를 사용하는 경우, 그것은 일부 structural pseudo classes을 지원, PHP 관련,하지만하지 않습니다. 이렇게하려면 :nth-of-type(3n), :nth-of-type(3n+1),:nth-of-type(3n+2)을 사용해보세요.

0

또 다른 가능한 해결책은 PHP 자체를 사용하지 않는,하지만 같은 jQuery를이 쉽게 될 수있다 :

$("table tr").each(function() { 
    var i = $("table tr").index($(this)); 
    $(this).addClass("d" + (i % 3)); 
}); 

내가이 시나리오를 설명하기 위해 jsFiddle를 만들었습니다.

관련 문제