twitter-bootstrap - Bootstrap:如何更改流体行中div的顺序？

如何在引导程序中重新排列/交换某些流体容器/行的顺序.....

如果我们在下一页举一个bootstrap的流畅示例：

http://twitter.github.com/bootstrap/examples/fluid.html

他们在流畅的一排左侧有侧边栏，然后在同一排带有一个英雄单元。然后在下一行中提供一些内容。当我们切换到移动视图/较小的屏幕时，它以相同的顺序出现。但是我们如何改变顺序。即如何在页面末尾显示侧边栏，并在页面顶部显示英雄单位？

最佳答案

新版本的Bootstrap v3现在支持列排序：

列顺序

使用.col-push-* and .col-pull-*修饰符类轻松更改内置网格列的顺序。

 <div class="row">
  <div class="col-md-9 col-md-push-3">9</div>
  <div class="col-md-3 col-md-pull-9">3</div>
</div>

将给出以下命令：

 ----------------------------
|     3     |      9       |
----------------------------

说明文件：
http://getbootstrap.com/css/#grid-column-ordering