javascript - 在移动设备上从左向右移动标题

Question

我有两个标题

<section>
    <header class="col-lg-9">
        <!-- some content -->
    </header>
    <header class="col-lg-3">
        <!-- some content -->
    </header>
</section>

第一个标题通常出现在左侧，第二个标题通常出现在右侧。因为在移动设备中第一个标题首先出现，滚动后第二个标题出现。

基本上我想在移动 View 中移动左侧的第二个标题和右侧的第一个标题。 (最大 991 像素)。这样第二个标题将首先出现，然后第一个标题将出现在移动 View 中。

Answer 1

您可以使用 Bootstrap 的原生 column ordering来完成这个。

例子:

<section>
    <header class="col-lg-9 col-sm-push-9">
        <!-- some content -->
    </header>
    <header class="col-lg-3 col-sm-pull-3">
        <!-- some content -->
    </header>
</section>