在不同的断点处将引导程序列带到上一行吗？

Question

我在Grid上浏览过Bootstrap的文档-我可能遗漏了一些东西，但是我看不到这样做的方法。

我有一行包含三列（每列为col-lg-4）-我想在col-md断点（col-md-6）将其重新组织为两列，但接下来我接下来要留空到第三个元素（因为该行包含三个元素）。

我提供了一个图表来说明我的意思。

是否有一种方法（本机自举）可以将下一行的内容向上填充以填充此空白空间？

Answer 1

您的解释是正确的，但看来您的html结构做错了什么。

我为您创建了一个working fiddle，向您展示一种可能的解决方案。这是运行代码：

.row {
  margin-top: 20px;
}

.col-lg-4 {
  padding: 10px;
}

.inside-col {
  background: #aaa;
  color: #fff;
  text-align: center;
  padding: 100px 50px;
  min-height: 200px;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row">
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
    <div class="col-lg-4 col-md-6">
      <div class="inside-col">
        col-md-4 col-lg-6
      </div> 
    </div>
  </div> 
</div>