2017-11-17 220 views
0

我需要将冻结温度(32F,0C)的单元格的背景颜色更改为#bff9ff,但有一些困难。我试图在<td>内部打印CSS类,但似乎只是在循环内部不能正常工作并且正在同时打印。使用PHP While循环更改表格的单元格背景颜色

但是,这是一个问题。我如何识别冻结温度和低于手动但不使用PHP的单元格?

<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Unit 3 part 2</title> 

     <style> 
      table { 
       font-family: arial, sans-serif; 
       border-collapse: collapse; 
       width: 100%; 
      } 

      tr:hover { 
       background-color:#bff9ff; 
       } 

      td, th { 
       border: 1px solid #dddddd; 
       text-align: left; 
       padding: 8px;`` 
      } 
      .cell { 
       background-color: #00bfff; 
       }  

     </style> 

</head> 
<body> 

    <table border="1" cellpadding="3"> 

     <thead> 
      <th>Fahrenheit</th> 
      <th>Celsius</th> 
     </thead> 

     <?php 
     $fahrenheit = 50; 

     while ($fahrenheit >= -50) { 

      $celsius = ($fahrenheit - 32) * 5/9; 

      print "<tr><td>$fahrenheit</td><td>$celsius</td></tr>"; 

      $fahrenheit -= 5; 
      $celsius -= 5; 



     } ?> 

    </table> 

</body> 
</html> 

回答

0

通过添加一个if语句来测试温度,然后向td标签添加一个类,应该照顾它。

<html> 
<head> 
    <meta charset="UTF-8"> 
    <title>Unit 3 part 2</title> 
    <style> 
     table { 
      font-family: arial, sans-serif; 
      border-collapse: collapse; 
      width: 100%; 
     } 
     tr:hover { 
      background-color:#bff9ff; 
      } 
     td, th { 
      border: 1px solid #dddddd; 
      text-align: left; 
      padding: 8px;`` 
     } 
     .cell { 
      background-color: #00bfff; 
      } 
     .cell.freezing { 
      background-color: #bff9ff; 
     } 
    </style> 
</head> 
<body> 
    <table border="1" cellpadding="3"> 
     <thead> 
      <th>Fahrenheit</th> 
      <th>Celsius</th> 
     </thead> 
     <?php 
     $fahrenheit = 50; 
     while ($fahrenheit >= -50) { 
      $celsius = ($fahrenheit - 32) * 5/9; 
      $class = ''; 
      if($fahrenheit <= 32) { 
       $class = ' freezing'; 
      } 
      print "<tr><td class='cell $class'>$fahrenheit</td><td class='cell $class'>$celsius</td></tr>"; 
      $fahrenheit -= 5; 
      $celsius -= 5; 
     } ?> 
    </table> 
</body> 
</html> 
+0

高兴它为你工作,请接受的答案。谢谢! –

0

创建一个名为“freeze”的CSS类。如果添加冷冻类,例如使用,

"<td class='$freezing'></td>" 

基本上评估此:

if (32 <= $farenheit || 0 <= $celcius) { 
    $freezing = "freezing"; 
} 

编辑:CSS

.freezing { 
    background-color: #bff9ff; 
} 
相关问题