如何使用 bootstrap 网格实现行跨度

Question

我正在尝试实现类似这样的堆栈：

http://homedepot.ca

他们是否使用 jQuery 扩展来实现该布局的效果，如果是，是哪一个？源头上的快速峰值并没有告诉我太多...

看起来他们可能正在使用 Zurb 的 Foundation，而不是我最初假设的 Bootstrap。也许 jQuery 图书馆叫花岗岩？

我希望最左边的列假定它是垂直和水平的 space，而较小的右边列将有 2 或 3 行更小的图像。

我需要每个单元格假设它的最大宽度和高度基本上同时在较小的设备上保持响应和垂直折叠。

有什么想法吗？

Answer 1

他们基本上使用了 Bootstrap 中类似的嵌套行。 http://www.bootply.com/OCSQsH71zp

<div class="container">
<div class="row">
  <div class="col-md-8">Something</div>
  <div class="col-md-4">
        <div class="row">
            <div class="col-md-12">Something</div>
            <div class="col-md-12">Something</div>    
         </div> 
  </div>  
  </div>
</div>

您有两个初始列。在右列中，您添加了另一行，其中两列各横跨整个宽度。