通过php在3个不同的div中组织从MySQL表获取的图像链接

我想用Bootstrap制作一个有3列的照片库。我的图库结构应如下所示：

<div class="row">
   <div class="col-4" id="box1">
      <img class="img-fluid" src="images/image1.jpg">
      <img class="img-fluid" src="images/image4.jpg">
   </div>
   <div class="col-4" id="box2">
      <img class="img-fluid" src="images/image2.jpg">
      <img class="img-fluid" src="images/image5.jpg">
   </div>
   <div class="col-4" id="box3">
      <img class="img-fluid" src="images/image3.jpg">
      <img class="img-fluid" src="images/image6.jpg">
   </div>
</div>

---

您应该能够将图像数组分为3列，每列都有一个。然后，您可以使用普通的

foreach

循环分别迭代3列中的每一列

<?php
$imageQuery = $mysqli->query("SELECT imageURL FROM images WHERE album = 'UK' ORDER BY date ASC");
$images = $imageQuery->fetch_all(MYSQLI_ASSOC);
$images = array_chunk($images, 3);
?>
<div class="row">
   <div class="col-4" id="box1">
   <?php foreach (array_column($images, 0) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
   <div class="col-4" id="box2">
   <?php foreach (array_column($images, 1) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
   <div class="col-4" id="box3">
   <?php foreach (array_column($images, 2) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
</div>

---

使用
die（mysqli_error（$conn））是一个非常糟糕的主意
在您的代码中，因为它可能会泄漏敏感信息。有关更多说明，请参阅本文：
<?php
$imageQuery = $mysqli->query("SELECT imageURL FROM images WHERE album = 'UK' ORDER BY date ASC");
$images = $imageQuery->fetch_all(MYSQLI_ASSOC);
$images = array_chunk($images, 3);
?>
<div class="row">
   <div class="col-4" id="box1">
   <?php foreach (array_column($images, 0) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
   <div class="col-4" id="box2">
   <?php foreach (array_column($images, 1) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
   <div class="col-4" id="box3">
   <?php foreach (array_column($images, 2) as $image): ?>
        <img class="img-fluid" src="<?= $image['imageURL']; ?>">
   <?php endforeach; ?>
   </div>
</div>