Html 安排3个引导COL

我有这样一个引导页面：

<div class="row">
    <div class="col-md-2 col-xs-6">
        A
    </div>
    <div class="col-md-8">
       B
    </div>
    <div class="col-md-2 col-xs-6">
       C
    </div>
</div>

因此，如果我在移动设备上查看它，它会显示为：

---
|A|
|B|
|C|
---

我想让它们显示为：

-----
|A|C|
| B |
-----

A和C各包含一个图像，而B应包含文本

我试过：

<div class="container-fluid">
    <div class="row">
        <div class="col-md-2 col-xs-6">
            1
        </div>
        <div class="col-md-8 col-md-push-8" >
            2
        </div>
        <div class="col-md-2 col-md-pull-2 col-xs-6">
            3
        </div>
    </div>
</div>

1.
2.
3.

但我没有得到预期的结果。我能做什么

问候,， GenXCoders

你只需要考虑“移动优先”

A.
C
B

---

非常感谢。。。它就像我想要的那样工作。。。还有，我会记得，它是“移动第一”。。。

<div class="container-fluid">
    <div class="row">
        <div class="col-md-2 col-xs-6">
            1
        </div>
        <div class="col-md-8 col-md-push-8" >
            2
        </div>
        <div class="col-md-2 col-md-pull-2 col-xs-6">
            3
        </div>
    </div>
</div>

<div class="container-fluid">
    <div class="row">
        <div class="col-md-2 col-xs-6">
            A
        </div>
        <div class="col-md-2 col-md-push-8 col-xs-6">
            C
        </div>
        <div class="col-md-8 col-md-pull-2">
            B
        </div>
    </div>
</div>