html - 当 html 不相邻时在同一行 Bootstrap 列

Question

我有这个使用 bootstrap 的 html 代码:

<div class="row">
    <div class="col-sm-12 col-xs-6"><h1>DIV1</h1></div>
    <div class="col-xs-12"><h1>DIV2</h1></div>
    <div class="col-sm-12 col-xs-6"><h1>DIV3</h1></div>
<div>

它在除 xs 之外的所有设备上工作正常。在超小型设备上，我希望 DIV1 和 DIV3 位于同一行(第一行)。

我想保持所有其他设备的布局。

Answer 1

您可能需要添加额外的样式来实现此目的，因为 div 通常会紧随其后。您可以将定位设置为绝对定位，并为其他两个位置设置额外的底部边距，将中间位置放在下方。