我有两列相同的大小(.col-xs-12)，当屏幕尺寸对应于移动设备的尺寸时，我会改变它们的位置。我会把它们放在相反的顺序。
@H_404_7@解决方法
我已经看到，push和pull引导指令有助于实现这一点，但是可以用以下类更改相同大小的两列的位置吗？
div.col-xs-12.col-xs-push-12 p test1 div.col-xs-12.col-xs-pull-12 p test2
实际上，您不能通过push / pull帮助器类重新排列具有.col – * – 12的列。列的总和超过了由@ grid-columns定义的默认12列。
您可以更改HTML中的列的顺序，然后在较大的屏幕上使用排序类，如下所示：
<div class="row">
<div class="col-xs-12 col-sm-6 col-sm-push-6">
<p>test2</p>
</div>
<div class="col-xs-12 col-sm-6 col-sm-pull-6">
<p>test1</p>
</div>
</div>
或者使用this fancy approach来颠倒垂直放置的列的顺序：
@media (max-width: 767px) {
.row.reorder-xs {
transform: rotate(180deg);
direction: rtl; /* Fix the horizontal alignment */
}
.row.reorder-xs > [class*="col-"] {
transform: rotate(-180deg);
direction: ltr; /* Fix the horizontal alignment */
}
}
值得注意的是，CSS也改变了are supported in IE9;只是不要忘记添加供应商前缀。
