Bootstrap网格重新排列较小的分辨率

Question

我有this fiddle中给出的示例引导网格。

CREATE TABLE EMP_TABLE_BACKUP AS (SELECT * FROM EMP_TABLE ) WITH DATA;

将网格绘制为

在较小分辨率的设备中打开时，它会给出类似的内容（如果没有<div class="row"> <div class="col-md-3 col-xs-3">left</div> <div class="col-md-6 col-xs-6">Center</div> <div class="col-md-3 col-xs-3">Right </div> </div> 类

但是如何在较小分辨率的屏幕中设置如下所示重新排列网格？

Answer 1

您可以执行此操作，但需要您更改源订单。

＆＃13;

＆＃13;

.col{
  border: 1px solid #000;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
  <div class="col col-md-push-3 col-md-6 col-xs-12">Center</div>
  <div class="col col-md-pull-6 col-md-3 col-xs-6">left</div>
  <div class="col col-md-3 col-xs-6">Right </div>
</div>

＆＃13;

＆＃13;

＆＃13;