如何使用 Twitter Bootstrap v3.0 构建两列流体布局

2024-04-03

由于 bootstrap 在 v3.0 中删除了 *fluid css 类,因此我找不到构建两列流体布局的方法。目标是实现类似于旧文档中的流体布局示例的布局:http://getbootstrap.com/2.3.2/scaffolding.html#layouts http://getbootstrap.com/2.3.2/scaffolding.html#layouts


Bootstrap 3 中的网格现在默认是流动的(http://getbootstrap.com/getting-started/#migration-dropped http://getbootstrap.com/getting-started/#migration-dropped)。你只需要使用.row and .container..

<div class="container">
    <div class="row">
        <div class="col-md-2">
            Sidebar content
        </div>
        <div class="col-md-10">
            Body content
        </div>
    </div>
</div>

然而,这不会是 100% 宽度。如果你想要 100% 宽度,你可以这样做..http://www.bootply.com/86324 http://www.bootply.com/86324

UPDATE:3.0.1及以后版本使用container-fluid为全宽。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 Twitter Bootstrap v3.0 构建两列流体布局 的相关文章

随机推荐