如何在移动设备上堆叠 Bootstrap 4 Div 并在桌面上并排排列它们？

使用 Bootstrap 4 重新定位 div：在移动设备上堆叠，在桌面上并排

您想要在移动设备上重新排序 Bootstrap div，并且将它们并排放置在

解决方案：

1. 禁用 Flexbox 以实现更大的宽度：
   Bootstrap 4 的 Flexbox 为列分配相同的高度。为了防止这种情况，请对大于中等宽度的宽度禁用 Flexbox。

<div>
<ol start="2"><li>
<strong>使用较小宽度的浮动（移动设备）：</strong><br>启用列浮动以允许第二列和第三列（B 和 C）包裹在第一列下方(A).</li></ol>
<pre class="brush:php;toolbar:false">        <div>
<ol start="3"><li>
<strong>分配列顺序：</strong><br>使用 order- 实用程序类在移动设备上对列重新排序。在本例中，将第一列的顺序设置为 1 (order-1)，将第二列的顺序设置为 0 (order-0)。这会将 A 放置在移动设备上的 B 下方，同时在桌面上保持其并排排列。</li></ol>
<pre class="brush:php;toolbar:false">        <div><p>此解决方案实现了所需的布局，A 列保持完整高度，B 列和C 在移动设备上堆叠在下方。</p></div>