划分Bootstrap网格列的最佳方法
CodeMan
我按照以下方式划分了Bootstrap网格列。
<div class="container-fluid">
<div class="row">
<div class="col-md-3">A</div>
<div class="col-md-6">
<div class="col-md-12">B1</div>
<div class="col-md-12">
<div class="col-md-8">B1.1</div>
<div class="col-md-4">B1.2</div>
</div>
<div class="col-md-12">
<div class="col-md-10">B2.1</div>
<div class="col-md-2">B2.2</div>
</div>
</div>
<div class="col-md-3">C</div>
</div>
</div>
请在下面找到此代码的视觉布局。
我划分网格列的方法正确还是错误？
桑耶夫
始终将列包装在一行中，以避免在调整大小时发生任何CSS中断
<div class="container-fluid">
<div class="row">
<div class="col-md-3">A </div>
<div class="col-md-6">B
<div class="row">
<div class="col-md-12">B1</div>
</div>
<div class="row">
<div class="col-md-8">B1.1</div>
<div class="col-md-4">B1.2</div>
</div>
<div class="row">
<div class="col-md-10">B2.1</div>
<div class="col-md-2">B2.2</div>
</div>
</div>
<div class="col-md-3">C </div>
</div>
</div>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
Bootstrap网格列划分剂量不起作用
- 2
这是划分Gruntfile的最佳方法
- 3
创建div网格的最佳方法？
- 4
创建div网格的最佳方法？
- 5
创建具有动态内容的不对称两列网格的最佳方法是什么？
- 6
Bootstrap-4列网格
- 7
Bootstrap-4列网格
- 8
Twitter Bootstrap 4列网格？
- 9
如何使用Bootstrap 4 Flexbox网格突破12列网格？
- 10
Bootstrap：具有可变列数的网格
- 11
Bootstrap网格系统中列的最小宽度
- 12
Jade / Bootstrap + Nodejs：网格渲染列错误
- 13
Bootstrap SASS网格的列填充错误
- 14
Bootstrap网格包裹不到12列
- 15
隐藏和显示Bootstrap网格列
- 16
如何使用Bootstrap嵌套列网格
- 17
Bootstrap列网格：保证金问题
- 18
Bootstrap 4网格列合并
- 19
无法在Bootstrap网格中获得两列
- 20
隐藏和显示Bootstrap网格列
- 21
Bootstrap SASS网格的列填充错误
- 22
Twitter Bootstrap网格问题：列对齐
- 23
HTML Bootstrap网格列不对齐
- 24
Bootstrap网格列无法正常工作
- 25
相互之间的Bootstrap网格系统列
- 26
Bootstrap网格崩溃->顶部的右列？
- 27
带网格列的 Bootstrap 3 词缀
- 28
Bootstrap 4 列网格 - 响应性
- 29
Bootstrap 3.3.7 网格系统列大不工作
我来说两句