html - Bootstrap grid collapse -> right columns on top？

Question

我读到我可以使用 https://getbootstrap.com/css/#grid-column-ordering 来订购我的网格列，但是，不幸的是，我找不到仅在折叠状态下才具有“右列优先”的方法。

目前我有两列“LEFT”(col-lg-4)和“RIGHT”(col-lg-8)。我希望 RIGHT 列折叠在 LEFT 列的顶部，但如果不折叠则留在右侧。

怎么做？

Answer 1

对于较新的 Bootsrap 版本，您可以使用 flex-column reverse 并设置 reverse 属性发生的大小(即低于 flex-lg-row):

<div class="row flex-column-reverse flex-lg-row">
    <div class="col-lg-4">
        sidebar
    </div>
    <div class="col-lg-8">
        main
    </div>
</div>

在以下位置有一个重复的线程: How do I change Bootstrap 3 column order on mobile layout?