如何使用Bootstrap响应中心Div堆栈？

Question

我正在使用Bootstrap 2.3.2响应式布局，并尝试为一组Div设置两个不同的订单。全屏水平布局的一个订单，以及在较小的屏幕上垂直堆叠时的不同订单。

使用这样的简单设置：

<div class="row-fluid">
    <div class="span4" id="A">
    </div>
    <div class="span4" id="B">
    </div>
    <div class="span4" id="C">
    </div>
</div>

我在全尺寸布局上水平获得A，B，C。但是当屏幕缩小时，我希望垂直堆叠为B，A，C。

我试过这个：

<div class="row-fluid">
    <div class="span4" id="B">
    </div>
    <div class="span4 pull-left" id="A">
    </div>
    <div class="span4" id="C">
    </div>
</div>

但水平布局为B，A，C。

如何获得A，B，C的水平布局以及B，A，C的垂直？

Answer 1

最简单的方法是切换到Bootstrap 3.0.0。有JS脚本可以为你重新排序元素，但是在我看来，Bootstrap的本地方式优于它们。

检查documentation