Bootstrap 5网格系统:一行能否包含超过12列?
Bootstrap一行中列总和超过12是否可行?
当然可行,Bootstrap的网格系统本身就支持这种用法。当一行内的列总宽度超过12列时,超出的列会自动换行到下一行。
比如你提到的3个col-lg-6,在大屏幕(lg断点及以上)下,前两个col-lg-6会刚好占满一行(6+6=12),第三个col-lg-6会自动换到下一行,单独占满整行宽度。
给你看个实际代码示例:
<div class="row"> <div class="col-lg-6">区块1</div> <div class="col-lg-6">区块2</div> <div class="col-lg-6">区块3</div> </div>
在lg及以上尺寸的屏幕上,这个结构会渲染成两行:第一行是两个各占50%宽度的区块,第二行是一个占100%宽度的区块。
这种特性很实用,能帮你在响应式布局中,不用手动拆分row就能实现不同断点下的自动换行需求。
内容的提问来源于stack exchange,提问作者Saoud ElTelawy
相关产品推荐
相关产品推荐

