堆積股利秩序引導3

我使用自舉3個格。在大屏幕上，我有兩列並排的內容。左列是一個單一的股利和右列是由2個的div，像這樣：堆積股利秩序引導3

(left) 
col-md-6 
div 1 
col-md-6 

(right) 
col-md-6 
div 2 
div 3 
col-md-6

，我想爲他們在這個順序堆疊時屏幕小：

div 2 
div 1 
div 3

感謝您的幫助

來源

2015-12-20 Augusto

<div class="container"> 
 
    <div class="row"> 
 
    <div class="col-xs-12 col-lg-6"> 
 
     <div class="well hidden-xs">Div 1</div> 
 
     <div class="well visible-xs">Div 2</div> 
 
    </div> 
 
    <div class="col-xs-12 col-lg-6"> 
 
     <div class="row"> 
 
     <div class="col-xs-12 col-lg-12"> 
 
      <div class="well hidden-xs">Div 2</div> 
 
      <div class="well visible-xs">Div 1</div> 
 
     </div> 
 
     <div class="col-xs-12 col-lg-12"> 
 
      <div class="well">Div 3</div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

我認爲這是你在找什麼。

來源

2015-12-20 21:12:40 justincron

謝謝！但是我使用這個解決方案將所有3個div放在一個大屏幕上。當放在小屏幕上時，最右邊的div仍然不在中間。也許如果你在你的例子中顯示div數字？ – Augusto

所以你想在正確的div divs互相內嵌或一個在另一個大屏幕上？ – justincron

右側的div應該彼此重疊。在小屏幕上堆疊的順序應該是：1.右上div，2.左div，3.右下div。 – Augusto

寫DIV 1兩次在div 2和右列的格3之間的一個左邊（在那裏已經放置）和第二。現在使用類可見XL在左欄DIV 1和DIV是2和3之間放置在由該股利1左欄將在大屏幕可以看到，因爲它是和在右列DIV 1可見-XS將會隱藏小屏幕，右欄的div 1將可見。因此，無論如何，它將在小型設備和大屏幕設備中顯示爲您提到的順序。

來源

2015-12-20 17:48:48

這是有道理的，我想這將靜態內容的工作。然而，我有一個窗體裏面的div，將不得不重複，所以我想我不能使用這個解決方案。 – Augusto

Anil的答案几乎是你能夠完成這個任務的唯一方法（我知道的）。我在上面的示例中創建了他所說的內容。 – justincron

你的代碼語言是什麼？如果支持部分網頁或HTML輔助重用一個div的一部分像asp.net的MVC話，我不認爲它會通過這種方法。第二個問題，你不會對自舉推薦的方式來做到這一點這一點。 –

堆積股利秩序引導3

回答

相關問題