Question

使用Bootstrap来布局页面，起初我在网格中有图像，就像在Facebook上一样，有4个连续，随着页面缩小，连续的图像数量也是如此。现在我已经添加了php，因此更新页面更容易，但图像都显示在彼此之下。我怎么能按原样使用呢？

使用的代码：

<section  id="alf40">
   <div class="container-fluid no-padding ">
<div class="row">

        <div class="col-lg-3 col-md-4 col-xs-6 thumb" style="display:inline-block; float:left; position:relative;" >
        <?php $SQL = "SELECT * FROM nw_photo";
        $result = mysql_query($SQL);
        while ( $db_field = mysql_fetch_assoc($result) ) { ?>

            <a class="thumbnail" href="#"><img class="img-responsive" src="
    <?php echo $db_field['image']; ?>" style="display:inline-block; float:left; position:relative;">
            <?php } ?></a>
        </div>

</div>
</div>
  </section>

Answer 1

Juste移动此行

<div class="col-lg-3 col-md-4 col-xs-6 thumb" style="display:inline-block; float:left; position:relative;" >

制作这样的模板：

<section  id="alf40">
   <div class="container-fluid no-padding ">
      <div class="row">
        <?php 
          $SQL = "SELECT * FROM nw_photo";
          $result = mysql_query($SQL);
          while ( $db_field = mysql_fetch_assoc($result) ) { ?>
            <div class="col-lg-3 col-md-4 col-xs-6 thumb" style="display:inline-block; float:left; position:relative;" >
               <a class="thumbnail" href="#"><img class="img-responsive" src="
                 <?php echo $db_field['image']; ?>" style="display:inline-block; float:left; position:relative;">
               </a> 
            </div>
       <?php } ?>       
   </div>
</div>

Div，包括php出现在每个彼此旁边

1 个答案: