自举网格系统布局

Question

我已经阅读了一些引导网格系统文档，但没有答案可以解决我的问题。 我想要我的html布局如下图所示，有没有办法通过使用Bootstrap网格系统来做到这一点。

Answer 1

是的，这是可能的，非常容易

<div class="container-fluid">
   <div class="row">
        <div class="col-md-8 col-xs-12">
             both 1 and 3
       </div>
  </div>

 <div class="col-md-4 col-xs-12">
      both 2 nd 4 grid
</div>
</div>

Answer 2

这是代码：

<div class="container">
  <div class="row">
    <div class="col-sm-6">
      1
    </div>
    <div class="col-sm-6">
      2
    </div>
    <div class="row">
    <div class="col-sm-6">
      3
    </div>
    <div class="col-sm-6">
      4
    </div>
    </div>

勾选小提琴调整窗口大小：https://jsfiddle.net/uL8jsxt2/

Answer 3

你必须遵循引导规则，网格系统的设计灵活性......布局问题的许多答案都是“嵌套”

<div class="container">
  <div class="row">
    <div class="col-sm-9">
    </div>
    <div class="col-sm-3">
    </div>
  </div><!--repeat row-->
</div><!-- /container -->