Question

使用Bootstrap v3.1.1

当浏览器窗口大于＆lt; 992px时，div安排：

[左]

[主要]

[右]

我怎么能让他们这样安排呢？

[主要]

[左] [右]

*主要居中和左边＆amp;在它下面居中

<div class="container">
    <div class="row clearfix">
        <div class="col-md-2 column left" style="background: rgb(108,108,240)></div>
        <div class="col-md-8 column main" style="background: rgb(108,108,240)"></div>
        <div class="col-md-2 column right" style="background: rgb(108,108,240)></div>    
    </div>
</div>

Answer 1

您可以使用col-sm-*或col-xs-*

为较小的设备定义列宽

<div class="container">
    <div class="row clearfix">
        <div class="col-md-2 col-sm-12 column left" style="background: rgb(108,108,240)"></div>
        <div class="col-md-8 col-sm-6 column main" style="background: rgb(108,108,240)"></div>
        <div class="col-md-2 col-sm-6 column right" style="background: rgb(108,108,240)"></div>    
    </div>
</div>

但最大的列（主要）需要在div列表中排在第一位

JSFiddle

在桌面上自定义引导程序列排列

1 个答案: