html – 在哪里放置bootstrap行类

概述我是引导程序和响应式设计概念的新手. 我正在阅读bootstrap文档并阅读w3schools的一些教程.所有提到col-must = 12在一行中.他们还提到你可以组合不同的col类和大小示例< div class =“col-md-3 col-xs-6”> 我没有得到的是你何时应该使用< / row>来打破视口？当你组合不同的col大小时上课？ 请考虑以下内容,我希望移动设备显示2行和2列,在 我是引导程序和响应式设计概念的新手.

我正在阅读bootstrap文档并阅读w3schools的一些教程.所有提到col-must = 12在一行中.他们还提到你可以组合不同的col类和大小示例< div class =“col-md-3 col-xs-6”>

我没有得到的是你何时应该使用< / row>来打破视口？当你组合不同的col大小时上课？

请考虑以下内容,我希望移动设备显示2行和2列,在桌面上显示包含4行的单个列

<div >            <div >                <div >                </div>                <div >                </div>                <div >                </div>                <div >                </div>           </div><!--/row -->       </div><!--/container -->

考虑到行内的所有列必须= 12,行类需要在移动和桌面的不同点上关闭……？

我如何解决上述问题,希望这个问题有道理.

谢谢

解决方法 您的代码是 correct,不需要更多.rows. W3schools教程是误导性的,说“.col – * – *每行应该总共加起来12”是错误的.

在bootstrap .row中有更多(或更少)12个列单位是可以的.它被称为列包装,只会使额外的列包裹到下一行……

从Bootstrap docs开始：

“If more than 12 columns are placed within a single row,each group of
extra columns will,as one unit,wrap onto a new line”

这就是为什么bootstrap文档中的示例演示了在单个.row中使用超过12列的原因.使用column wrapping时,如果列的高度不同,则需要注意responsive resets(称为“clearfix”).

有许多响应方案(如您的示例),其中单个.row元素中的列单位必须超过12.一个常见的误解是列单位在单个.row中必须为12或更小.

类似问题..

Bootstrap what will happen if I put more than 12 columns in a row?

Bootstrap 3 – row can I have columns add up to more then 12?

总结

以上是内存溢出为你收集整理的html – 在哪里放置bootstrap行类全部内容，希望文章能够帮你解决html – 在哪里放置bootstrap行类所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。