首页 > 解决方案 > 如何获取数据库记录为

s 不改变固定
s 在左边和右边?

问题描述

布局图:

布局图像

我想设计如图所示的引导 div 布局。我需要在左右角放置横幅广告。在中间,我需要使用 PHP 从数据库中获取数据的动态 div 。但是在中间,当我以动态 div 的形式获取数据时,当记录数增加时,第二个横幅广告就会下降。我该如何解决这个问题?

  <div class="col-lg-2" style="padding-top: 50px;">
    <div class="card" >

    <img src="img/cement_Ad.jpg" height="500" width="300">
    </div>
  </div>

<!-- 2 --> 

<div class="col-lg-8" style="padding-left: 250px;">


<!-- 4 --> 
<?php


$sql="select * from services ";



$result = $con->query($sql);

if ($result->num_rows > 0) {
    ?>

    <?php
    while($row = $result->fetch_assoc()) {
    ?>
<div class="col-lg-3" style="padding-top: 40px; padding-left: 20px;">

<section>
  <div class="well" >
    <div class="card" >
      <div class="row ">
        <div class="col-md-4">
            <img src="img/img1.jpg" height="150px" width="120px">
          </div>
          <div class="col-md-8 px-3">
            <div class="card-block px-3">
              <h4 class="card-title"><?php echo $row ['name']; ?></h4>

            <div >
                <label>Email</label>
                <?php echo $row ['email']; ?>
            </div>
            <div >
                <label>Address</label>
                <?php echo $row ['address']; ?>
            </div>
            <div >
                <label>District</label>
                <?php echo $row ['district']; ?>
            </div>
            <div >
                <label>City</label>
                <?php echo $row ['city']; ?>
            </div>
            <div >
                <label>Service</label>
                <?php echo $row ['service']; ?>
            </div>
            <div >
                <label>Years of Experience</label>
                <?php echo $row ['years']; ?>
            </div>
            <div>
                <label>Details</label>
                <?php echo $row ['details']; ?>
            </div>
              <a href="#" class="btn btn-success">Read More</a>
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</section>
</div>     
    <?php
    }
} else {
    echo "0 results";
}
$con->close();
?>
</div>
  <div class="col-lg-2" style="padding-top: 50px; ">
    <div class="card" >

    <img src="img/pipe_Ad.jpg" height="500" width="300">
    </div>
  </div>

这是我使用下面给出的 Mr.E-Azam 的答案后的结果 在此处输入图像描述

标签: phphtmlcss

解决方案


检查下面 -

 <div class="col-lg-2" style="padding-top: 50px;">
    <div class="card" >

    <img src="img/cement_Ad.jpg" height="500" width="300">
    </div>
  </div>

<!-- 2 --> 

<div class="col-lg-8">


<!-- 4 --> 
<?php


$sql="select * from services ";



$result = $con->query($sql);

if ($result->num_rows > 0) {
    ?>

    <?php
    while($row = $result->fetch_assoc()) {
    ?>
<div class="col-lg-3" style="padding-top: 40px;">

<section>
  <div class="well" >
    <div class="card" >
      <div class="row ">
        <div class="col-md-4">
            <img src="img/img1.jpg" height="150px" width="120px">
          </div>
          <div class="col-md-8 px-3">
            <div class="card-block px-3">
              <h4 class="card-title"><?php echo $row ['name']; ?></h4>

            <div >
                <label>Email</label>
                <?php echo $row ['email']; ?>
            </div>
            <div >
                <label>Address</label>
                <?php echo $row ['address']; ?>
            </div>
            <div >
                <label>District</label>
                <?php echo $row ['district']; ?>
            </div>
            <div >
                <label>City</label>
                <?php echo $row ['city']; ?>
            </div>
            <div >
                <label>Service</label>
                <?php echo $row ['service']; ?>
            </div>
            <div >
                <label>Years of Experience</label>
                <?php echo $row ['years']; ?>
            </div>
            <div>
                <label>Details</label>
                <?php echo $row ['details']; ?>
            </div>
              <a href="#" class="btn btn-success">Read More</a>
            </div>
          </div>

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

    <?php
    }
} else {
    echo "0 results";
}
$con->close();
?>

</div> 
  <div class="col-lg-2" style="padding-top: 50px; ">
    <div class="card" >

    <img src="img/pipe_Ad.jpg" height="500" width="300">
    </div>
  </div>

推荐阅读