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

如果您仍然遇到問題，或者如果你還是不知道如何實施該解決方案，讓我知道，我們將通過你的工作一起編碼。