Html 如何使用boostrap进行响应性网格设计（布局问题）

我是新来的引导，如何才能使这个布局

这是我尝试过的，但错了（必须是图片链接）

A
X
Y
B

如果有帮助，请检查此选项

.bg{背景色：#f1f1；宽度：100%；高度：100%}

A
X
Y
B

中的顺序不正确mobile@Kevin我尝试了您的代码，但在移动视图中它是错误的，结果与我的错误代码相同，应该是X A Y B。请检查图像链接您可能需要为

X

复制代码。请查看引导

class=“order-***-**”

使用BS/Flexbox不可能--另请参见

显示：内容

。

     <div class="col-12 col-lg-4">A</div>   
     <div class="col-12 col-lg-4">
            <div class="row">
                    <div class="col">X</div>  
                    <div class="col">Y</div>  
            </div>
     </div>   
     <div class="col-12 col-lg-4">B</div>