如何在 bootstrap 中切换两列的位置

Question

我正在尝试使用 bootstrap 实现一个三栏网站，并且有

[left-sidebar] [main-content] [right-sidebar]

当这个布局在移动端浏览时变成这样

[left-sidebar] 
[main-content] 
[right-sidebar]

所以我想把 [main-content] 的位置换成 [left-sidebar]

[main-content]
[left-sidebar]  
[right-sidebar]

这是我用过的代码

<div class  = "row">
    <div class = "col-md-3">
        [left-sidebar]
    </div>
    <div class = "col-md-6">
        [main-content]
    </div>
    <div class = "col-md-3">
        [right-sidebar]
    </div>
</div>

Answer 1

试试这个：

<div class="row">
    <div class="col-md-6 col-md-push-3">
        [main-sidebar]
    </div>
    <div class="col-md-3 col-md-pull-6">
        [left-content]
    </div>
    <div class="col-md-3">
        [right-sidebar]
    </div>
</div>

如何在 bootstrap 中切换两列的位置

How to switch place of two columns in bootstrap

html

multiple-columns

twitter-bootstrap-3