奇数偶数彩色行成重复区域

时间:2016-05-28 16:13:31

标签: php html css css3

我尝试让它在重复区域工作,但它不起作用。

<body>
<?php do { ?>
<table class="test">
<tr>
<td><?php echo $row_Recordset1['fld1']; ?></td>
<td>...</td>
<td><?php echo $row_Recordset1['fld2']; ?></td>
<td>...</td>
<td><?php echo $row_Recordset1['fld3']; ?></td>
</tr>
</table>
<?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
</body>

,风格是

<head>
<style type = "text/css">
.test tr:nth-child(even) {background: #A4D1FF;}
.test tr:nth-child(odd) {background: #F2F2F2;}
</style>
</head>

实际上动态表生成了超过50行,因此它需要进入PHP循环... 完整页面代码但它仍然无法正常工作...... 谢谢你的回答...

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style type = "test">
.test tr:nth-child(even) { 
    background: #A4D1FF;
}
.test tr:nth-child(odd) {
    background: #EAF4FF;
}
</style>
</head>
<body>
  <table class="test">
<?php do { ?>
    <tr>
      <td><?php echo $row_Recordset1['movies']; ?></td>
      <td></td>
      <td><?php echo $row_Recordset1['et_paragogis']; ?></td>
      <td></td>
      <td><?php echo $row_Recordset1['format']; ?></td>
    </tr>
  <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
  </table>  
</body>
</html>
<?php
mysql_free_result($Recordset1);
?>

4 个答案:

答案 0 :(得分:1)

答案很简单:在PHP循环外部取<table>个标签。您应该只在表的开头和结尾生成一组<table>标记,而不是每行。一旦你这样做,你的CSS就有机会工作。

答案 1 :(得分:1)

如果你将table放出PHP循环(<?php do { ?>),你会得到类似的东西

.test tr:nth-child(odd) {
  background: #F2F2F2;
}
.test tr:nth-child(even) {
  background: #A4D1FF;
}
<table class="test">
  <tr>
    <td>
      odd
    </td>
    <td>odd</td>
  </tr>
  <tr>
    <td>
      even
    </td>
    <td>
      even
    </td>
  </tr>
</table>

答案 2 :(得分:1)

在do-while循环之外取<table>标记。

<body>
    <table class="test">
        <?php do { ?>
        <tr>
            <td><?= $row_Recordset1['fld1']; ?></td>
            <td>...</td>
            <td><?= $row_Recordset1['fld2']; ?></td>
            <td>...</td>
            <td><?= $row_Recordset1['fld3']; ?></td>
        </tr>
        <?php } while ($row_Recordset1 = mysql_fetch_assoc($Recordset1)); ?>
    </table>
</body>

N.B。当你回应某些东西时,尝试使用<?= ?>而不是<?php ?>标签。它更灵活。 PHP Tags

答案 3 :(得分:0)

用jquery解决 如果有人将来需要它 感谢大家

    <?php do { ?>
  <table border="0" cellpadding="0" cellspacing="0">
    <tbody>
    <script src="jquery.js"></script>
  <script> 
  $(document).ready(function()
  {
      $("tr:even").css("background-color", "#ffffff");
      $("tr:odd").css("background-color", "#f2f2f2");
  });
  </script>
      <tr>
        <td width="60" align="left"><?php echo $row_Recordset1['et_paragogis']; ?></td>
        <td width="5">&nbsp;</td>
        <td width="30" align="right"><?php echo $row_Recordset1['movies']; ?></td>
        <td width="8">&nbsp;</td>
        <td width="90" align="left"><?php echo $row_Recordset1['format']; ?></td>
      </tr>