html - Bootstrap col-md-* 移动 View 时排序

Question

我有以下 Bootstrap 。当在移动设备上显示时，我得到

啊啊啊

呜呜呜

抄送

是否可以通过移动 View 将顺序更改为

呜呜呜

啊啊啊

抄送

<div class="container innerrow">
    <div class="row">
        <div class="col-md-12">
            <div class="col-md-4">
                aaa
            </div>
            <div class="col-md-4">
                bbb
            </div>
            <div class="col-md-4">
                ccc
            </div>
        </div>
    </div>
</div>

Answer 1

您可以使用 Bootstrap 帮助类而不需要 flex-box(前提是您可以编辑 HTML)。

<div class="container innerrow">
<div class="row">
        <div class="col-md-4 col-md-push-4">
            bbb
        </div>
        <div class="col-md-4 col-md-pull-4">
            aaa
        </div>
        <div class="col-md-4">
            ccc
        </div>
</div>

代码笔:https://codepen.io/giannidk/full/VWPzMO