Bootstrap：更改移动设备上全宽列的顺序答案

【问题标题】：Bootstrap: change order of fullwidth columns on mobile devicesBootstrap：更改移动设备上全宽列的顺序
【发布时间】：2016-07-12 21:00:22
【问题描述】：

我有这样的架构：

[col-1][col-2]

（它们的宽度都是 12 块）

还有我的html：

<div class="col-xs-12 col-md-5">1</div>
<div class="col-xs-12 col-md-7">2</div>

是否可以在 xs-mobile 设备上以这种方式显示？：

2
1

我试过了：

<div class="col-xs-12 col-md-5 col-xs-push-12">1</div>
<div class="col-xs-12 col-md-7 col-xs-pull-12">2</div>

但它没有帮助（

【问题讨论】：

【解决方案1】：

将列按移动优先顺序放置，然后使用推/拉在更大的屏幕上重新排序...

<div class="col-xs-12 col-md-5 col-md-push-7">2</div>
<div class="col-xs-12 col-md-7 col-md-pull-5">1</div>

【讨论】：

【解决方案2】：

对于移动设备，您可以像这样更改订单..

<div class="col-xs-12 col-sm-5 col-sm-push-7">2</div>
<div class="col-xs-12 col-sm-7 col-sm-pull-5">1</div>

【讨论】：