首页 > 解决方案 > 响应式引导行跨度式重新排序

问题描述

使用 Bootstrap 4 是否可以从

|   | b |   |
| a |---| c |
|   | d |   |

on xs to

|         | a |
|         |---|
|    b    | c |
|         |---|
|         | d |

在 sm 及以上?

一直在查看 flex 文档,但找不到在不隐藏和显示重复布局元素的情况下实现两者的方法。

<div class="container pl-0 pr-0">
    <div class="row no-gutters">
        <div class="col-2 categories">
            a
        </div>
        <div class="col-8">
            <div class="mainPanel">
                b
            </div>
            <div class="colors">
                d
            </div>
            <div class="item"><< Select Item >></div>
        </div>
        <div class="col-2 patterns">
            c
        </div>
    </div>
</div>

这构建了第一个示例,但是将 b 和 d 嵌套在另一个 div 中意味着它们不能按照我的意愿重新排序。

标签: flexboxbootstrap-4

解决方案


推荐阅读