Question

有没有一种方法可以创建具有5列的Bootstrap Carousel，并使用while循环来输出所有图像？它如何处理行和列？这是我的while循环：

  <?php if( have_rows('logos') ): ?>

<?php while( have_rows('logos') ): the_row(); 
        // vars
        $image = get_sub_field('logo_image');
        $content = get_sub_field('name');
?>
<div class="item active">
  <a href="#"><img src="<?php echo $image['url']; ?>"></a>
<?php endwhile; ?>
<?php endif; ?>

Answer 1

这里是示例：

 <?php if( have_rows('logos') ): ?>
<div class="row">
<?php while( have_rows('logos') ): the_row(); 
        // vars
        $image = get_sub_field('logo_image');
        $content = get_sub_field('name');
?>
  <div class="item active col-2">
    <a href="#"><img src="<?php echo $image['url']; ?>"></a>
  </div>

<?php endwhile; ?>
</div>
<?php endif; ?>

Bootstrap doc：

将 .col-用于超小 <576px ==>示例： col-2，   col-6

使用 .col-sm-表示 Small ≥576px ==>示例： .col-sm-2   ，.col-sm-6

将 .col-md-用于中 ≥768px ==>示例： .col-md-2   ，.col-md-6

将 .col-lg-用于大 ≥992px ==> 示例：.col-lg-2   ，.col-lg-6

将 .col-xl-用于特大 ≥1200px ==> 示例：.col-xl-2   ，.col-xl-6

使用while循环在5列Bootstrap Carousel中显示无限数据

1 个答案: