【问题标题】:Table tr background color change表格tr背景颜色变化
【发布时间】:2011-10-06 09:02:17
【问题描述】:

我试图让奇怪的<tr> 甚至<tr> 有不同的颜色以便于阅读。

这是我的代码:

$show_res = mysql_query($show_query);
while ($show_row = mysql_fetch_assoc($show_res)){
$rc++;
if (($rc > 1)){
    $tr = '#cccccc';
} else {
    $tr = '#ffffff';
}?>
  <tr style="background-color:<?php echo $tr ;?>">

它不起作用,我错过了什么吗?

【问题讨论】:

标签: php css mysql html-table


【解决方案1】:

你想使用模 %

一些例子:

  • 5 % 2 = 余数为 1
  • 4 % 2 = 余数为 0
  • 6 % 2 = 余数为 0
  • 9 % 2 = 余数为 1

因此,根据余数是 1 还是 0,您可以更改颜色。并且您希望 &lt;tr&gt; 元素成为循环的一部分,因为它不断地从一种颜色或另一种颜色来回改变。

$show_res = mysql_query($show_query);
while ($show_row = mysql_fetch_assoc($show_res))
{
    $rc++;
    if ($rc % 2 == 1)
    {
        $tr = '#cccccc';
    } 
    else 
    {
        $tr = '#ffffff';    
?>
  <tr style="background-color:<?php echo $tr ;?>">
<?
    }
}
?>

【讨论】:

  • 正是我想要的!谢谢
  • @Warface 好吧,那就给我点数吧。我只帮助这个网站上的人获得任意创建的积分。 (绿色检查):-D
【解决方案2】:
$show_res = mysql_query($show_query);
while ($show_row = mysql_fetch_assoc($show_res)){
$rc++;
if (($rc > 1)){
    $tr = 'odd';
} else {
    $tr = 'even';
}?>
  <tr class="<?php echo $tr ;?>">

CSS

.odd td { background-color: #FFF; }
.even td { backgorund-color: #F6F6F6; }

使用 CSS 并将颜色背景设置为 TD 而不是 TR 元素。

【讨论】:

    【解决方案3】:

    由于这是严格的显示,我建议使用 Javascript,而不是 PHP。

    看看它有多么简单: http://paragasu.wordpress.com/2009/01/05/alternate-table-row-color-the-easy-way/

    【讨论】:

      【解决方案4】:

      你是否在任何地方定义了$rc=0;

      【讨论】:

        【解决方案5】:

        您遇到的问题似乎是您在增加 $rc++ 后没有重置它。尝试将其设置为 0,然后在将其增加到 1 后将其重置。

        【讨论】:

          【解决方案6】:
          $show_res = mysql_query($show_query);
          while ($show_row = mysql_fetch_assoc($show_res))
          {
                 if ( isset($k) and $k==1)
                 {
                       echo '<tr class="EvenTableRows">';
                       $k=0;
                  } else {
                       echo  '<tr class="OddTableRows">'; 
                       $k=1;
                  }
          
                ..... more statement
          
          }
          

          【讨论】:

            猜你喜欢
            • 2019-08-30
            • 2017-11-17
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            • 2017-04-14
            • 2021-10-02
            • 2014-09-14
            • 2021-02-13
            相关资源
            最近更新 更多