css - 使用 Bootstrap 3 更改部分顺序

Question

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

我想改变三个部分的顺序，就像我制作的这个模式一样:

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

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