Question

如何使用bootstrap网格系统实现以下功能？

..............................
.                  .         .
.  col-md-9(div1)  . col-md-3.
.................... (div2)  .
.                  .         .
.  col-md-9(div3)  .         .
....................         .
.                  ...........
.                            .
.                            .
..............................

我尝试了以下内容：

<div class="col-md-9">
</div>

<div class="col-md-3">
</div>

<div class="col-md-9" style="float: left;">
</div>

这给了我这样的东西：

..............................
.                  .         .
.  col-md-9(div1)  . col-md-3.
.................... (div2)  .
.                  .         .
.                  .         .
.                  .         .
..............................
.                  .         .
.  col-md-9(div3)  .         .
..............................

我做错了什么？

Answer 1

<div class="container">
 <div class="row">
  <div class="col-sm-9">
    <div class="row">
      <div class="col-sm-12">Test Left</div>
      <div class="col-sm-12">Test Under Left</div>
    </div>
   </div>
    <div class="col-sm-3">Test Right</div>
  </div>
</div>

这是一个粗略的例子。见http://www.bootply.com/8u0TlzECVR

bootstrap网格：如何实现一个阵型，我在左边一个在另一个下面，在右边有一个

1 个答案: