CSS – цвет фона строки таблицы нечетный / четный

У меня есть таблица, которая динамически генерируется PHP. Я надеюсь, что я смогу использовать CSS для применения фона, основанного на том, что строка таблицы нечетна / четна, т. Е. Цвет фона вращает каждую другую строку.

Имеет ли это смысл? Благодаря!

Вы можете использовать селектор nth-of-type () или nth-child () в CSS3. Поддерживается всеми современными браузерами.

Например…

tr:nth-child(odd) { background-color: #ccc; } /* Do this… */ tr:nth-of-type(odd) { background-color: #ccc; } /* …or this */ tr:nth-of-type(even) { background-color: #ccc; } 

Попробуй это :

CSS:

 .row0{ background:white; } .row1{ background:black; } 

в php при печати строк (trs)

 <?php $i = 0; foreach( ... ){ $i = 1-$i; $class = "row$i"; ?> <tr class="<?php echo $class ?>"> ... 

Теоретически это так же просто, как tr:nth-child(even) { background: #999; } tr:nth-child(even) { background: #999; } Однако поддержка nth-child не удивительна и будет работать только с новейшими браузерами

Пример :

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <title>Test</title> <style type="text/css"> thead, tr:nth-child(even) { background: #aaa; } </style> </head> <body> <table> <thead> <tr><th>Header</th><th>Header</th></tr> </thead> <tr><td>Data</td><td>Data</td></tr> <tr><td>Data</td><td>Data</td></tr> <tr><td>Data</td><td>Data</td></tr> </table> </body> </html> 

Вы можете сделать что-то вроде этого:

 $counter = 0; while(............){ $counter++; $bgcolor = ($counter % 2 === 0) ? 'red' : 'blue'; } 

Теперь вы можете использовать bgcolor="<?php echo $bgcolor;?>" Для ваших TDs 🙂

Обратите внимание, что выше будет работать во всех браузерах, включая IE6.

В CSS определите ниже класс

 .color0 { #fff; } .color1 { #ccc; } 

В PHP Code используйте следующую технику

 while($row=mysql_fetch_assoc($q)) { echo "<tr class='color$c'>"; echo "<td>data</td>"; echo "</tr>\n"; $c=!$c; } в while($row=mysql_fetch_assoc($q)) { echo "<tr class='color$c'>"; echo "<td>data</td>"; echo "</tr>\n"; $c=!$c; } 

я думаю, лучший вариант – использовать внутренний итератор foreach:

пример :

 <table> <?php foreach ($foo as $key => &$bar) : ?> <tr class="<?php echo ($key + 1) % 2 ? 'odd' : 'even'; ?>"> <td> ... </td> </tr> <?php endforeach; ?> </table> 

это мой путь, вы можете попробовать это

 <style type="text/css"> .even{ background-color:#333; } .odd{ background-color:#666; } </style> <?php $i=0; foreach( ... ){ ++$i; ?> <tr class="<?php echo ($i%2) ? 'even' : 'odd' ?>"> <td>..</td> </tr> <?php } ?> 

Для небольшого php внутри html вы можете использовать

 <?php echo ($striped)?'even':'odd';$striped=!$striped;?> 

используйте чередование между четным и нечетным.

просто делай так

  $codd[0] = 'even'; $codd[1] = 'odd'; $codd_i = 1; foreach($items as $item){ $codd_i = ($codd_i+1)%2; ?> <tr class="<?php echo $codd[$codd_i] ?>"> </tr> <?php } >