Bootstrap - 更改所有设备的订单

Question

我正在使用Bootstrap 3.3.5。在“媒体装置”是所有完美的，结构是： AB C.但是，当我想表明它在小型设备上的结构是：

A 
C 
B 

我想：

A 
B 
C 

我的代码：

<div class="container"> 
    <div class="row"> 
     <div class="col-md-4 col-sm-12">A</div> 
     <div class="col-md-4 col-sm-12 col-md-push-4">C</div>     
     <div class="col-md-4 col-sm-12 col-md-pull-4">B</div> 
    </div> 
</div> 

我不能移动div。我只能通过引导样式移动。

Demo

你能帮助我吗？ 非常感谢。

Answer 1

您正在寻找“推”和“拉”类。见Bootstrap Column Ordering Documentation.

编辑：我想我误解了你的问题。如果我现在正确地阅读它，它看起来像你试图切换“c”的位置与“b”的位置。如果是这种情况，那么仅使用Bootstrap是不可能的，因为您正在使用12个单元列。我在堆栈溢出中找到了一些解决方案，它们使用媒体查询魔术来移动div。下面是一些参考：

Change the order of col-*-12 columns in Bootstrap 3 by using push/pull

Swap DIV position with CSS only

如果您仍然遇到问题，或者如果你还是不知道如何实施该解决方案，让我知道，我们将通过你的工作一起编码。