使用Bootstrap，我需要替换我的Div的顺序

Question

我的引导代码如下。

<div class="container">
  <div class="row">
    <div class="col-sm-4">
    </div>
    <div class="col-sm-8">
    </div>
   </div>
   <div class="row">
     <div class="col-sm-8">
     </div>
     <div class="col-sm-4">
     </div>
   </div>
</div>

我需要有关创建CSS媒体查询的帮助，以便将col-sm-4定位在手机上的col-sm-8之上。谢谢！

Answer 1

您可以使用重新排序类来执行此操作。请参阅Docs。

参见工作示例片段

{{1}}

Answer 2

将您的代码更改为：

<div class="container">
  <div class="row">
    <div class="col-sm-4 col-xs-12">
    </div>
    <div class="col-sm-8 col-xs-12">
    </div>
   </div>
   <div class="row">
     <div class="col-sm-8 col-xs-12">
     </div>
     <div class="col-sm-4 col-xs-12">
     </div>
   </div>
</div>

应该做的伎俩。