当前第2页 返回上一页
如下
1 2 3 4 5 6 7 8 | 固定宽度布局
<div class="container">
...
</div>
或者 流式布局
<div class="container-fluid">
...
</div>
|
在bootstrap的css文档中@media属性
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | 1591~1605行
@media (min-width: 768px) {
.container {
width: 750px;
}
}
@media (min-width: 992px) {
.container {
width: 970px;
}
}
@media (min-width: 1200px) {
.container {
width: 1170px;
}
}
……
|
以上代码实现了随浏览器宽度的变化container容器的宽度也进行变化。
推荐：bootstrap入门教程
以上就是bootstrap怎么实现响应式布局的详细内容，更多文章请关注木庄网络博客！
返回前面的内容
相关阅读 >>
浅谈bootstrap中如何上传图片
bootstrap是响应式的吗
bootstrap如何给div设置边框颜色
bootstrap 怎么设置字体颜色
bootstrap被淘汰了么
浅谈bootstrap中的panel布局
bootstrap实现简单侧边导航栏效果
bootstrap怎么在jsp使用方法
bootstrap 不支持ie怎么办
bootstrap用什么ui
更多相关阅读请进入《bootstrap》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
转载请注明出处：木庄网络博客 » bootstrap怎么实现响应式布局
