在 Bootstrap 中翻转 3 列网格顺序答案

【问题标题】：Flipping 3 column grid order in Bootstrap在 Bootstrap 中翻转 3 列网格顺序
【发布时间】：2016-12-31 02:24:06
【问题描述】：

我有一个 3 列网格，当断点很大时需要翻转列顺序。

在小断点列应显示 col3 col2 col1
在中等断点列应显示 col2 col1 col3
在大断点列应显示 col 1 col2 col3

这个JSFiddle 在 col-sm 和 col-md 断点上表现正确。我尝试添加推/拉类来影响所需的大断点行为（上面的条件 3），但无法使其工作。我想我被 col-md 上也发生的排序绊倒了。我想要小，中，大的订购行为。这是如何实现的？

<div class="container">
  <div class="row-fluid">
    <div class="col-xs-12 col-sm-12  col-md-3 col-md-push-9 bg-warning">
      column 3
    </div>
    <div class="col-xs-12 col-sm-12  col-md-5 col-md-pull-3  bg-danger">
      Column 2
    </div>
    <div class="col-xs-12 col-sm-12  col-md-4 col-md-pull-3  bg-success">Column 1
    </div>
  </div>
</div>

【问题讨论】：

您可以检查环境并与 Jacquelyn 一起排列列

标签： twitter-bootstrap-3

【解决方案1】：

我终于明白了。这是JSFiddle中的解决方案。

<div class="container">
  <div class="row-fluid">
    <div class="col-xs-12 col-sm-12  col-md-3 col-md-push-9 bg-warning">
      column 3
    </div>
    <div class="col-xs-12 col-sm-12  col-md-5 col-md-pull-3 col-lg-push-1 bg-danger">
      Column 2
    </div>
    <div class="col-xs-12 col-sm-12  col-md-4 col-md-pull-3  col-lg-pull-8 bg-success">Column 1
    </div>
  </div>
</div>

【讨论】：