Bootstrap 的 WordPress 内容布局

WordPress content layout with Bootstrap

我正在尝试将 wordpress 内容拉到使用 Bootstrap 创建的网格结构中。但我不想为每一列创建单独的查询。如何在单个查询中提取同一类别的内容?我的代码是 follows.I 想要显示最后添加的 3 个项目

 <div class="container">
  <?php query_posts('showposts=3&orderby=date&cat=1'); ?>
  <?php while (have_posts()) : the_post(); ?>
  <div class="row">
  <div class="col-8">
  
      <img src="" class="img-fluid rounded" alt="...">
  </div>
  <div class="col-4">
      <img src="" class="img-fluid mb-3 rounded" alt="...">
      <img src="" class="img-fluid rounded" alt="...">
  </div>
  </div>
   <?php endwhile; ?>
  </div>

what i want to do

     <div class="container">
      <div class="row">
      <?php $i = 1; query_posts('showposts=3&orderby=date&cat=1'); ?>
        <div class="col-8">
      <?php while (have_posts()) : the_post(); ?>
        <?php if($i==1){ ?>
          <img src="" class="img-fluid rounded" alt="...">
        </div>
        <div class="col-4">
        <?php } elseif($i==2){ ?>
          <img src="" class="img-fluid mb-3 rounded" alt="...">
        <?php } else { ?>
        <img src="" class="img-fluid rounded" alt="...">
      <?php } $i++; endwhile; ?>
        </div>
      </div>
    </div>

click the picture for the problem

否则会造成问题。右栏中的 2 个内容也是相同的。我希望它与众不同。