У меня есть таблица, уже написанная на PHP, которая выводит данные из базы данных следующим образом:
<TABLE cellSpacing=1 cellPadding=2 align=center bgColor=#aaaaaa border=0 width="100%" class="logintbl"> <TR> <TD bgColor=whitesmoke colSpan=0><B>Pages</B></td> </tr> <tr> <td> <table align="center" cellSpacing=0 cellPadding=2 border="0" width="100%"> <tr> <td align="center" valign="bottom"> <font color="#4d71a1"><b>Page Name</b></font> </td> </tr> <?php while ($row = mssql_fetch_array($result)) { ?> <tr bgcolor="#eeeeee"> <td align="center"><?php echo $row["PageURL"]; ?></td> <td align="center"> <a href="PageUpdate.php?id=<?php echo $row["PageID"]; ?>"><img src="images/0013-pen.gif" width="16" height="16" alt="" border="0"></a> </td> </tr> <?php } ?> <tr><td colspan="7"> </td></tr> <tr> <td colspan="7" align="center"> </td> </tr> </table> </td> </tr> </table> Я пытаюсь чередовать цвета строк, используя фрагмент PHP, и после некоторых исследований это реализовано:
<tr bgcolor="<?php echo ($clrCounter++ % 2 == 0 ? '#000000' : '#ffffff'); ?>">
Кажется, он работает некорректно, поэтому я чувствую, что где-то ошибаюсь, я знаю, что есть более длительные способы реализации этого, который я мог бы реализовать. Я просто надеялся на что-то простое. Я трачу усилия, пытаясь реализовать его таким образом?
Я включил его следующим образом:
<TABLE cellSpacing=1 cellPadding=2 align=center bgColor=#aaaaaa border=0 width="100%" class="logintbl"> <TR> <td bgColor=whitesmoke colSpan=0><B>Pages</B></td> </tr> <tr> <td> <table align="center" cellSpacing=0 cellPadding=2 border="0" width="100%"> <tr bgcolor="#3A7525"> <td align="center" valign="bottom"> <font color="#4d71a1"><b>Page Name</b></font> </td> </tr> <?php while ($row = mssql_fetch_array($result)) { ?> <tr bgcolor="<?php echo ($clrCounter++ % 2 == 0 ? '#C2C2C2' : '#ffffff'); ?>"> <td align="center"><?php echo $row["PageURL"]; ?></td> <td align="center"> <a href="PageUpdate.php?id=<?php echo $row["PageID"]; ?>"><img src="images/0013-pen.gif" width="16" height="16" alt="" border="0"></a> </td> </tr> <?php } ?> <tr> <td colspan="7" align="center"> </td> </tr> </table> </td> </tr> </table>
Это вроде работы, но по какой-то причине самая первая запись – синяя ???? когда я указал белый и серый.
Вы можете использовать следующее при прохождении результатов, возвращаемых с вашего db:
<?php // Define row colors $color1 = "#FFFFFF"; $color2 = "#F4F9FF"; // Set row counter $row_count = 0; while ($row = mssql_fetch_array($result)) { $row_color = ($row_count % 2) ? $color1 : $color2; ?> <tr bgcolor="<?php echo $row_color; ?>"> <td align="center"><?php echo $row["PageURL"]; ?></td> <td align="center"> <a href="PageUpdate.php?id=<?php echo $row["PageID"]; ?>"><img src="images/0013-pen.gif" width="16" height="16" alt="" border="0"></a> </td> </tr> <?php $row_count++; } ?>
Кроме того, вы можете заменить теги bgcolor и назначить класс CSS для каждой строки.
Используйте селектор CSS :nth-of-type( ) .
Помещая разные стили для :nth-of-type(even) и :nth-of-type(odd) браузер выполняет альтернативный стиль для вас, поэтому вам не придется беспокоиться об этом.
См. Запись W3Schools на этом.
Попробуй это:
<tr <?php if($i%2){?>bgcolor="#eeeeee"<?php } else{ ?>bgcolor="red" <?php } $i++; ?>>
Спасибо Bas van den Heuvel за отличный ответ, используя CSS. Если вы столкнулись с дополнительным расстоянием между строками, как и я, и хотите удалить его, используйте следующий примерный код. Это заставит чередующиеся цветные линии быть более плотными вместе. (Я использовал светло-серый и белый)
p:nth-of-type(odd) { background:#e2e2e2; margin: 0px; padding: 0px; } p:nth-of-type(even) { background:#ffffff; margin: 0px; padding: 0px; }