我刚开始使用Bootstrap并浏览文档。现在,似乎非常混乱,并有一些问题如下:
在Grid Options表中,为什么容器宽度始终小于设备宽度,为什么不等于例如小型设备平板电脑的设备宽度(≥768px)。
如何确定750px的宽度,为什么不是743px或755px或任何其他尺寸。他们是如何确定750px作为容器宽度的。
如上所述,bootstrap最多可扩展到12列,列之间有沟槽,每列宽度为 因此,〜62px和排水沟是30px(每侧15px) (12(cols)* 62px)+(11(gutters)* 15(width))等于909px而不是给定的750px容器宽度。为什么?
这对我来说非常困惑。有人可以plz显示如何计算不同断点的容器宽度以及容器宽度不等于设备宽度的原因吗?
由于 DK
答案 0 :(得分:1)
Bootstrap .container
用作居中容器,如果您想在所有设备上使用全宽度.container-fluid
在小断点处62px实际上是62.5px。 62.5 x 12 = 750px,这包括每列周围的15px填充。由于使用了填充(而不是沟槽位于柱外的边缘),因此沟槽位于柱内。
这是一个很好的视觉演示:http://www.codeply.com/go/Sul9kw8Kne
除容器宽度外,请查看此article about the BS3 grid
答案 1 :(得分:0)
首先,如果您希望容器等于设备宽度,请使用
container-fluid instead of container
对于网格系统,有两个概念
在bootstarp中,网格中没有像素,只有百分比(%)。 所有媒体quire断点都是通过bootstartp设置的,你可以通过bootstrap customizer http://getbootstrap.com/customize/更改这些值。