首页 > 解决方案 > 使用 php 和 html 使用多种颜色使表格行变得丰富多彩

问题描述

以下代码可以使用两种颜色交替制作带有颜色的表格:

$num = mysql_num_rows($qPhysician);
$i=0;
echo "<table>"
while($i < $num)

{
if ($i % 2 == 0){
echo "<tr class='style1'>";
}
else{
echo "<tr class='style2'>";
}
echo "<td>" . mysql_result($qPhysician,$i,"lastName") . "</td>";

echo "<td>" . mysql_result($qPhysician,$i,"firstName") . "</td>";

echo "</tr>";

$i++;

}
echo "</table>";

假设我有多种颜色。红色、绿色、黄色、蓝色等。有没有办法让桌子交替使用这些颜色?我将如何做到这一点?

标签: phphtmlcss

解决方案


嗨 user10179141 试试这个代码 css 和 html。

table tr:nth-child(2n) {
    background-color: #4a94ed;
    border-color: #4a64ed;
}
<table>
  <tr>
    <td>Col 1</td>
    <td>Col 2 </td>
  </tr>
  <tr>
    <td>Col 1</td>
    <td>Col 2 </td>
  </tr>
  <tr>
    <td>Col 1</td>
    <td>Col 2 </td>
  </tr>
  <tr>
    <td>Col 1</td>
    <td>Col 2 </td>
  </tr>
</table>

定义和使用

:nth-child(n) 选择器匹配其父元素的第 n 个子元素,无论其类型如何。

n 可以是数字、关键字或公式。

示例情况,我需要在文本中选择第二段。

我用p:nth-child(2) {css propertys}

https://codepen.io/pauloserafimtavares/pen/gjqrYQ

W3C CSS 选择器的更多信息 https://www.w3schools.com/cssref/sel_nth-child.asp


推荐阅读