Question

这个问题适用于Twitter Bootstrap 3.我有三个列，其顺序和大小我想根据屏幕大小而有所不同。

在md：

----------------
|1   |2   |3   |
----------------

在sm：

----------------
|1      |3     |
----------------
|2             |
----------------

我认为我应该使用第二个和第三个col元素进行拉/推，但我还不能正确...

我知道这不起作用，但到目前为止它看起来像......

<div class="row">
  <div class="col-sm-6 col-md-4 form-group">
    ...
  </div>
  <div class="col-sm-12 col-sm-push-6 col-md-4 form-group">
    ...
  </div>
  <div class="col-sm-6 col-sm-pull-6 col-md-4 form-group">
    ...
  </div>
</div>

Answer 1

这看起来怎么样？ Live view

<div class="row">
  <div class="col-sm-6 col-md-4 form-group">
    1
  </div>
  <div class="col-sm-6  col-md-4 col-md-push-4 form-group">
    3
  </div>
  <div class="col-sm-12 col-md-4 col-md-pull-4 form-group">
    2
  </div>

</div>

希望这有帮助！

在Bootstrap中具有拉/推/偏移的行/列的顺序

1 个答案: