如何使 PHP html 表的行之间颜色不匹配？

Question

我一边编码一边学习 PHP。 w3schools 上的一个示例显示了使用 PHP 和 msql 在 html 表上显示数据库结果。我的问题是，我现在有太多行，我无法使它们在行之间具有不匹配的颜色。我尝试在 之后添加样式跨度和字体颜色，但它不接受。如果我这样做的话整个 PHP 就无法工作。

<?php
$con = mysql_connect("localhost","peter","abc123");
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("my_db", $con);

$result = mysql_query("SELECT * FROM Persons");

echo "<table border='1'>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>";

while($row = mysql_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysql_close($con);
?>

上面代码的输出将是：

Firstname   Lastname
Glenn   Quagmire
Peter   Griffin

http://www.w3schools.com/php/php_mysql_select .asp

Answer 1

不完全确定您所说的颜色不匹配是什么意思。假设您的意思是交替行颜色，我会执行以下操作：

$odd = false;

while (...)
{
    echo '<tr class="'.($odd ? "odd" : "even").'">';
    ...
    echo "</tr>";
    $odd = !$odd;
}

现在您的 tr 元素属于 odd 或 even 类 交替使用，并且可以在 CSS 中为其中之一指定一些额外的背景颜色，例如：

tr.odd { background-color: rgba(0, 0, 0, 0.05); }

Answer 2

将此： 替换

while($row = mysql_fetch_array($result))
  {
  echo "<tr>";
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "</tr>";
  }

为：

$i = 0;
while($row = mysql_fetch_array($result))
  {
  echo "<tr ". ($i % 2 == 0 ? 'style="background-color:grey;"' : '' .">";
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "</tr>";
  $i++;
  }

每隔一行将具有灰色。

Answer 3

也许您可以将这种方法与 jquery 一起使用

<script src="text/javascript">
    $('#table tbody tr:odd').addClass('odd');
    $('#table tbody tr:even').addClass('even');
</script>

，然后添加样式

.odd { background-color: #color }
.even { background-color: #color }

Answer 4

$class = "even";    
while($row = mysql_fetch_array($result))
{
  if($class == "even")
  {
    echo "<tr class='$class'>";
    $class = "odd";
  }
  else
  {
    echo "<tr class='$class'>";
    $class = "even";
  }

  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "</tr>";
}

CSS

tr.even
{
    background-color:blue;//Pick your own color
}

tr.odd
{
    background-color:green;
}

这里是颜色名称的列表。如果您想要更详细的颜色选择，请点击此处 。

Answer 5

使用

  $flag = 0;
  while($row = mysql_fetch_array($result))
  {
  if ($flag%2 == 1)
  echo "<tr bgcolor=#123345>";
  else
  echo echo "<tr bgcolor=#643235>";
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "</tr>";
  $flag = $flag +1;
  }