【问题标题】:How to display each row with a different color如何用不同的颜色显示每一行
【发布时间】:2020-09-26 15:54:50
【问题描述】:

我是 PHP 新手,我想从我的数据库中显示一个表,其中每一行的颜色与其他行不同,我尝试了与我的问题类似的答案和解决方案,但我未能在 @ 的行上完成987654323@

这是我的脚本:

<?php
mysqli_report(MYSQLI_REPORT_ERROR | MYSQLI_REPORT_STRICT);
$mysqli = mysqli_connect('localhost','root','','class');
$mysqli->query("set names 'UTF8'");

$data = [];
$res = $mysqli->query("SELECT math, physics, english FROM student order by math desc");
while ($row = $res->fetch_assoc()) {
    foreach(array_keys($row) as $key) {
        $data[$key][] = $row[$key];
    }
}

?>

<div>student</div>
<table border="1">
  <?php foreach($data as $key => $val): ?>
    <tr>
      <td><?= $key ?></td>
      <?php foreach($val as $field): ?>
        <td><?= $field ?></td>
      <?php endforeach ?>
    </tr>
  <?php endforeach ?>
</table>

【问题讨论】:

  • 我发布的duplicate 更像是交替行的情况,而不是每行中不同的颜色。
  • 颜色应该重复多少条记录?如果您承认有 16,700,001 条记录,那么宇宙可能在浏览器呈现记录集之前就已经结束了,但是...... ??
  • @RamRaider 我正在学习 PHP 我想要例如数学、物理、英语的第一行是黄色的,第二行是不同的颜色,只是为了使差异可见我想要这样的东西 @987654322 @ 但对于我的问题。

标签: php html css


【解决方案1】:

你可以在 CSS 的帮助下做到这一点

对于偶数和奇数选择器,请遵循以下语法

table tr:nth-child(even) td{
   background: #f1f1f1;
}
table tr:nth-child(odd) td{
   background: #fff;
}

【讨论】:

    【解决方案2】:

    我只是使用以下函数作为示例,它返回随机颜色。该功能已由@outis发布

    function rand_color() {
      return '#' . str_pad(dechex(mt_rand(0, 0xFFFFFF)), 6, '0', STR_PAD_LEFT);
    }
    

    这将返回一个随机的 RGB 十六进制字符串,您可以在 foreach 循环中使用它,如下所示(注意&lt;tr&gt; 标签):

    <div>student</div>
     <table border="1">
       <?php foreach($data as $key => $val): ?>
       echo '<tr style="background-color:' . rand_color() .   '">';
         <td><?= $key ?></td>
          <?php foreach($val as $field): ?>
         <td><?= $field ?></td>
       <?php endforeach ?>
       </tr>
       <?php endforeach ?>
     </table>
    </div>
    

    如果您只想使用特定颜色,那么我建议在数组中定义这些颜色,然后在循环数据时使用这些颜色。

    【讨论】:

    • 先生,感谢您重播,您的解决方案可能对我不起作用,可能是因为我刚刚学习 PHP,我不知道如何使用它,但是我如何使用数组来获得特定的颜色我试过了answer 但我得到的结果只是所有行中的一种颜色,所以我如何在我的问题上使用这个答案的想法来获得特定的颜色并感谢您的帮助。
    猜你喜欢
    • 2012-08-24
    • 1970-01-01
    • 2023-04-05
    • 2016-10-15
    • 2016-08-05
    • 1970-01-01
    • 1970-01-01
    • 2016-12-29
    • 2020-07-24
    相关资源
    最近更新 更多