1

我将4 blocks on a row它们全部显示在桌面上的一行上，但是当我调整窗口大小（减小宽度）时，所有块都将显示在不同的行上。one column with 4 lines因此，即使一行可以容纳两个元素，我也会得到（4 个元素）。

I expect 2 lines with 2 elements插入 4 行和 1 个元素，更紧凑。如何做到这一点？

这是代码：

<div class="content row">
    <section class="col col-lg-3">  
        <label>block 1</label>
    </section>
    <section class="col col-lg-3">  
        <label>block 2</label>
    </section>
    <section class="col col-lg-3">  
        <label>block 3</label>
    </section>
    <section class="col col-lg-3">  
        <label>block 4</label>
    </section>
</div>

实际显示：

------   ------   ------   ------ 
|    |   |    |   |    |   |    |
|    |   |    |   |    |   |    |
------   ------   ------   ------

调整大小后显示：

---------------------------------
|                               |
|                               |
---------------------------------
---------------------------------
|                               |
|                               |
---------------------------------
---------------------------------
|                               |
|                               |
---------------------------------
---------------------------------
|                               |
|                               |
---------------------------------

调整大小后需要显示：

---------------   ---------------
|             |   |             |
|             |   |             |
---------------   ---------------
---------------   ---------------
|             |   |             |
|             |   |             |
---------------   ---------------

提：bootstrap v3.0.0

4

2 回答 2

1

你检查过Grid-Options吗？有像“col-xs-6”或“col-xs-3”等类。我相信你可以改变行为。

于 2013-10-29T09:34:04.040 回答
0

尝试

<div class="content row">
    <section class="col col-lg-3 col-sm-6">  
        <label>block 1</label>
    </section>
    <section class="col col-lg-3 col-sm-6">  
        <label>block 2</label>
    </section>
    <section class="col col-lg-3 col-sm-6">  
        <label>block 3</label>
    </section>
    <section class="col col-lg-3 col-sm-6">  
        <label>block 4</label>
    </section>
</div>
于 2013-10-29T14:56:12.950 回答