10-列排序pull和push

正常来说col的排序都是前面的排前，后面的排后。

通过 col-**-push-* 推（往右移动）多少个位置。

比如：

<div class="row show-grid">
  <div class="col-md-1 col-md-push-1">1</div>
  <div class="col-md-1">2</div>
  <div class="col-md-1">3</div>
  <div class="col-md-1">4</div>
  <div class="col-md-1">5</div>
  <div class="col-md-1">6</div>
  <div class="col-md-1">7</div>
  <div class="col-md-1">8</div>
  <div class="col-md-1">9</div>
  <div class="col-md-1">10</div>
  <div class="col-md-1">11</div>
  <div class="col-md-1">12</div>
</div>Code language: HTML, XML (xml)

第一个div往右推了一个列，就会导致1和2重叠了。

如果我们不想重叠，我们可以把2拉回到1的位置：

<div class="row show-grid">
  <div class="col-md-1 col-md-push-1">1</div>
  <div class="col-md-1 col-md-pull-1">2</div>
  <div class="col-md-1">3</div>
  <div class="col-md-1">4</div>
  <div class="col-md-1">5</div>
  <div class="col-md-1">6</div>
  <div class="col-md-1">7</div>
  <div class="col-md-1">8</div>
  <div class="col-md-1">9</div>
  <div class="col-md-1">10</div>
  <div class="col-md-1">11</div>
  <div class="col-md-1">12</div>
</div>Code language: HTML, XML (xml)

比如1和6进行交换：

<div class="row show-grid">
  <div class="col-md-1 col-md-push-5">1</div>
  <div class="col-md-1">2</div>
  <div class="col-md-1">3</div>
  <div class="col-md-1">4</div>
  <div class="col-md-1">5</div>
  <div class="col-md-1 col-md-pull-5">6</div>
  <div class="col-md-1">7</div>
  <div class="col-md-1">8</div>
  <div class="col-md-1">9</div>
  <div class="col-md-1">10</div>
  <div class="col-md-1">11</div>
  <div class="col-md-1">12</div>
</div>Code language: HTML, XML (xml)