如何切換引導程序中的元素順序3

我看了很多例子，但由於某種原因，我無法讓它自己工作。如何切換引導程序中的元素順序3

我有2個元素，我希望他們在移動，平板電腦和桌面視圖的3個不同位置。

Desktop: [A] [B] - 
Tablet: [A] - [B] 
Mobile: - [B] - 
     - [A] -

因此，對於桌面我想要元素A浮動到左邊，B在中間。對於平板電腦，我希望A左移，B右移。而對於手機，我想切換A和B的順序，並彼此重疊。

這只是Bootstrap可能嗎？

來源

2015-08-28 Vasar

可能的重複http://stackoverflow.com/questions/28274372/bootstrap-css-layout-of-irregular-tiles-using-push-and-pull/28274649#28274649 – Junaid

col-push-*可以解決你的問題：

<div class="row"> 
    <div class="col-sm-5 col-sm-push-5 well"> 
     Content B 
    </div> 
    <div class="col-sm-5 col-sm-pull-5 well"> 
     Content A 
    </div> 
</div>

Working demo

來源

2015-08-28 07:08:34 yakutsa

非常感謝，簡單的答案，我試圖做更復雜的事情。 – Vasar

找到fiddle demo

<div class="c b">b</div> 
<div class="c a">a</div>

CSS：

.c{ 
     width:50%; 
     text-align:center; 
     border:1px solid #000; 
    } 
    .b{ 
     float:right; 
     background:#eee; 
    } 
    .a{ 
     float:left; 
     background:#ccc; 
    } 
    @media (max-width: 640px){ 
     .b{ 
      float:left; 
     } 
     .a{ 
      float:right; 
     } 
    }

來源

2015-08-28 07:24:05 locateganesh

如何切換引導程序中的元素順序3

回答

相關問題