本文介绍了在小 scrn 处交换 2 列堆叠顺序-Bootstrap 推拉类或浮动修复?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
无论我做什么，我都无法让正确的列以 100% 宽度/小屏幕先推并堆叠.我试过 col-xs-pull/push-12 或 col-xs-pull/push-0.我也尝试弄乱 div 浮动，但无济于事.
我是否遗漏了一些明显的东西，或者我是否需要开始这个难题的第二阶段?
<div id="main" class="col-xs-12 col-xs-pull-? col-sm-8"></div><div id="r-column" class="col-xs-12 col-xs-push-? col-sm-4"></div> 解决方案
如果您采用移动优先"的方法，则将 r 列放在标记的首位，然后相应地使用推/拉
<div id="r-column" class="col-xs-12 col-sm-push-8 col-sm-4">right</div><div id="main" class="col-xs-12 col-sm-pull-4 col-sm-8">main</div>No matter what I do I can't get the right column to push over and stack first at 100% width/small scrns. I tried col-xs-pull/push-12 or col-xs-pull/push-0. I also tried messing around with the div floats, to no avail.
Am I missing something obvious, or do I need to start a Phase 2 of this conundrum?
<div class="row>
<div id="main" class= "col-xs-12 col-xs-pull-? col-sm-8"></div>
<div id="r-column" class="col-xs-12 col-xs-push-? col-sm-4"></div>
</div>
解决方案
If you go with a "mobile first" approach, you put the r-column first in your marking and then use push/pull accordingly
<div class="row">
<div id="r-column" class="col-xs-12 col-sm-push-8 col-sm-4">right</div>
<div id="main" class="col-xs-12 col-sm-pull-4 col-sm-8">main</div>
</div>
这篇关于在小 scrn 处交换 2 列堆叠顺序-Bootstrap 推拉类或浮动修复?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！