重新排序引导堆栈顺序

Question

我有一个关于Bootstrap网格的查询。我有一个网格，想象一下Excel，它具有第1行和第2行以及桌面浏览器模式下的A，B和C列。

desktop to stacked

我要重新排序在移动模式中的堆叠的 '细胞' 是A1，A2，B1，B2，C1，C2的顺序（从上至下）。我已经看了拉和推班，但它不做以上。任何人都可以建议如何实现它吗？

我发现了其他类似的答案，但没有完全符合我的问题。

感谢，

LB

Answer 1

退房这种结构。您需要制作3列，并在每列内添加一行中的全宽列。因此，在较小的屏幕上，它将从第1列开始堆叠到最后一列。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<div class="row"> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      A1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      A2 
 
     </div> 
 
    </div> 
 
    </div> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      B1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      B2 
 
     </div> 
 
    </div> 
 
    </div> 
 
    
 
    <div class="col-sm-3"> 
 
    <div class="row"> 
 
     <div class="col-xs-12"> 
 
      C1 
 
     </div> 
 
     <div class="col-xs-12"> 
 
      C2 
 
     </div> 
 
    </div> 
 
    </div> 
 

 

 
</div>