twitter-bootstrap – 将Bootstrap列堆叠在一起

发布时间：2020-12-18 00:25:23 所属栏目：安全来源：网络整理

导读：我正在使用Bootstrap v3来开发我的界面. 我使用以下代码段： div class="row" div class="col-sm-4 col-xs-4" h1Hello...!/h1 pPara 1/p /div div class="col-sm-8 col-xs-8" h1new div/h1 pPara 2/p /div /div 但是,当我减小浏览器的大小(宽度)时,列会越来

我正在使用Bootstrap v3来开发我的界面.
我使用以下代码段：

<div class="row">
        <div class="col-sm-4 col-xs-4">
            <h1>Hello...!</h1>
            <p>Para 1</p>
        </div>
        <div class="col-sm-8 col-xs-8">
            <h1>new div</h1>
            <p>Para 2</p>
        </div>
    </div>

但是,当我减小浏览器的大小(宽度)时,列会越来越小.
我想要的是,在一定的限制或最小宽度之后,div必须叠加在一起而不是变小.

解决方法

请按照此链接获取xs和sm,http://getbootstrap.com/css/#grid-example-mixed的列/网格的精确大小
您正在使用自定义宽度功能

<div class="col-sm-4 col-xs-4" >

这根据设备大小提供自定义宽度.相反,默认情况下使用此列可以将列堆叠起来

<div class="col-md-4">

而不是xs(xtra small)和sm(小尺寸),默认使用中等大小,bootstrap将完成剩下的工作.另外,您的列(4和8)也有两种不同的大小,视图将是不规则的.另外,如果你想继续使用列的自定义大小而不是我的方法,请记住：xs-4与sm-4不同

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!