Question

这是在w3响应布局的w3-row-padding中循环php in while循环的问题。布局中断了

这是源代码

    <?php 
$r=0;
 while($r<ceil($fetch_row_count/4)) 

              { ?>
      <div class="w3-row-padding w3-padding-16 w3-center" style="clear:both" id="food">
          <?php 

          while($row=mysqli_fetch_array($res)) 

              {

         ?>
        <div class="w3-quarter">
            <img src="admin/uploads/<?php echo $row['image']; ?>" alt="noodles" style="width:50%">
          <h3><?php echo $row['title']; ?></h3>
          <p><?php echo $row['description']; ?> </p>
        </div>

        <?php






              }
              $r++;
              }
              ?>

      </div>

感谢您提前回复和评论

Answer 1

没有为每个填充容器添加底部div。

编写代码的方式是添加一个填充容器，然后为每个结果集添加w3-quarter div，然后重复一遍，看起来对我来说每个数据集都是相同的之一。

你可能想要完成的只是制作一个填充的div然后用你内部的w3-quarter div回显你的结果集。

以下是您修改底部div的原始方式：

<?php 

$r=0;
while($r<ceil($fetch_row_count/4)) {

  echo        
  '<div class="w3-row-padding w3-padding-16 w3-center" style="clear:both" id="food">';

    while($row=mysqli_fetch_array($res)){

    echo      
    '<div class="w3-quarter">' .
    '<img src="admin/uploads/' . $row['image'] . '" alt="noodles" style="width:50%">' .
    '<h3>' . $row['title'] . '</h3>' .
    '<p>' . $row['description'] . '</p>' .
    '</div>';

    }

  $r++;

  echo
  '</div>';

}          

?>

以下是我认为您尝试这样做的方式:(只是猜测）

    <?php 

  echo        
  '<div class="w3-row-padding w3-padding-16 w3-center" style="clear:both" id="food">';

    $r = 0;    
    while($row=mysqli_fetch_array($res)){

      echo      
      '<div class="w3-quarter">' .
      '<img src="admin/uploads/' . $row['image'] . '" alt="noodles" style="width:50%">' .
      '<h3>' . $row['title'] . '</h3>' .
      '<p>' . $row['description'] . '</p>' .
      '</div>';

      $r++;
      //I would not actually try to control how many results you add like this.
      //I would get the results from a better formatted query.
      if($r < ceil($fetch_row_count/4)){

      break;

      }

    }

  echo
  '</div>';

?>

同时在w3-row-padding中循环w3-quarter

1 个答案: