如何使用引导程序4

时间:2019-01-01 09:13:10

标签: php html bootstrap-4

以下是我的代码,我使用Bootstrap类行将详细信息显示为每行3列。

我尝试过更改div和某些条件

<div class="container">
  <?php

  if($lclResult->rowCount() > 0){
    while($row = $lclResult->fetch(PDO::FETCH_ASSOC)) {
      # code...
      $lclUserName = $row['us_business_name'];
      $lclImage1 = $row['us_image1'];
      $lclCategory = $row['us_category'];
      $lclArea = $row['us_area'];

  ?>
  <div class="row">
    <div class="col-sm-4">
      <div class="card">
        <img class="card-img-top " src="<?php echo $lclImage1 ?>" alt="Card image" style="width:100%; height: 158px;">
        <div class="card-body">
          <h4 class="card-title"><?php echo $lclUserName?></h4>
          <p class="card-text" style="font-size: 25px;"><?php echo $lclCategory?></p>
          <hr>
          <i class="fa fa-map-marker" style="font-size: 23px;"><span>&nbsp;&nbsp;</span><?php echo $lclArea?></i>
          <!-- <a href="#" class="btn btn-primary">See Profile</a> -->

        </div>
      </div>


 <?php
  }
  ?>
 </div>
 <?php
 } else { 
 ?>
<div class="container">
 <div class="row">
  <div class="col-sm-12">
    <h1> NO RESULT FOUND...</h1>
  </div>
 </div>
</div>

<?php
   }
?>


   </div>  
 </div>

我想每行显示3列以显示数据。如果有人知道,请用上面的代码指导我。

1 个答案:

答案 0 :(得分:0)

像这样更改代码

<div class="container">
  <div class="row">
    <?php
if($lclResult->rowCount() > 0){
while($row = $lclResult->fetch(PDO::FETCH_ASSOC)) {
# code...
$lclUserName = $row['us_business_name'];
$lclImage1 = $row['us_image1'];
$lclCategory = $row['us_category'];
$lclArea = $row['us_area'];
?>
    <div class="col-sm-4">
      <div class="card">
        <img class="card-img-top " src="<?php echo $lclImage1 ?>" alt="Card image" style="width:100%; height: 158px;">
        <div class="card-body">
          <h4 class="card-title">
            <?php echo $lclUserName?>
          </h4>
          <p class="card-text" style="font-size: 25px;">
            <?php echo $lclCategory?>
          </p>
          <hr>
          <i class="fa fa-map-marker" style="font-size: 23px;">
            <span>&nbsp;&nbsp;
            </span>
            <?php echo $lclArea?>
          </i>
          <!-- <a href="#" class="btn btn-primary">See Profile</a> -->
        </div>
      </div>
    </div>
    <?php
}
?>
    <?php
} else { 
?>
    <div class="container">
      <div class="row">
        <div class="col-sm-12">
          <h1> NO RESULT FOUND...
          </h1>
        </div>
      </div>
    </div>
    <?php
}
?>
  </div>  
</div>