使用Bootstrap 3更改部分顺序

Question

在一个页面上，我有两列。在第一个（黑色），我有一个包含图像的部分。第二个，有两个块（蓝色和绿色）。

我想改变这三个部分的顺序，就像我在这个模式中所做的那样：

我找到了一些推拉操作的方法，但它只是将黑色块放在最后而不是第一个。

Answer 1

改编自Isherwood's answer in this very similar question：

在小屏幕上按顺序排列它们，然后在更大的屏幕上将它们拉到页面的适当位置：

<div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-6 blue pull-right"></div>
        <div class="col-xs-12 col-sm-6 black pull-left"></div>
        <div class="col-xs-12 col-sm-6 green pull-right"></div>
    </div>
</div>

Demo in Fiddle