Question

我正在为我的网站移动布局设计。

我有一个类似于：

的部分

<div class="col-lg-3"> Some html </div>
<div class="col-lg-3"> Some html </div>
<div class="col-lg-3"> Some html </div>
<div class="col-lg-3"> Some html </div>

显然，这4个div标签彼此相邻。

我需要此部分成对出现在手机中。其中每个div标签彼此相邻。

我该怎么做？

Answer 1

您可以向div添加更多类 - 比如说

<div class="col-md-6 col-lg-3"> Some html </div>
<div class="col-md-6 col-lg-3"> Some html </div>
<div class="col-md-6 col-lg-3"> Some html </div>
<div class="col-md-6 col-lg-3"> Some html </div>

这将使每个6个单位宽（12个中）在＆＃34;中＆＃34;显示，而不是每个3个单位＆＃34;大＆＃34;显示器。

您使用md还是sm等取决于您希望更改的屏幕尺寸。

＆＃34; Bootstrap grid examples＆＃34;很有帮助。

Answer 2

每一对都需要使用一个类来包装在div中，你可以控制内部div的位置。

<div>
    <div class="col-lg-3"> Some html </div>
    <div class="col-lg-3"> Some html </div>
</div>
<div>
    <div class="col-lg-3"> Some html </div>
    <div class="col-lg-3"> Some html </div>
</div>

在移动设备中使div标签相邻

2 个答案: