使用 Bootstrap 3 更改部分顺序答案

【问题标题】：Change section order with Bootstrap 3使用 Bootstrap 3 更改部分顺序
【发布时间】：2014-07-22 04:50:17
【问题描述】：

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

我想改变三个部分的顺序，就像我制作的这个架构一样：

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

【问题讨论】：

贴一些相关代码，我们可以帮助你！为什么不把所有这些都放在一列中呢？你想在调整大小时改变它吗？
左图是桌面大小，右图是手机吗？
Change column ordering from mobile to desktop layouts 的可能重复项
@JordanD ：是的，左边是桌面，右边是移动设备。
@BuddhistBeast : 我明天会发布一些代码，现在正在工作（我是实习生）

标签： css responsive-design twitter-bootstrap-3

【解决方案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

【讨论】：

与这个问题的格式几乎完全相同：stackoverflow.com/questions/24787646/…
@JordanD，是的！谢谢你。我以为我快疯了。我记得这个解决方案，并认为它非常聪明，我一直在寻找帖子，以便我可以将 / 关闭为重复。
感谢您的宝贵时间和回答。我现在知道答案已经存在，但在发布此答案之前我没有找到。我会努力在我未来的搜索中更有效。我会尽快尝试。当我尝试并且我很确定 thqt 会起作用时，我会接受这个答案。