2012-10-19 45 views
2

我正在研究Bootstrap,并且正在考虑有关偏移列的问题:http://twitter.github.com/bootstrap/scaffolding.html#gridSystemTwitter Bootstrap:偏移列?

该文档说“列应始终为每行添加12”。然后它给抵消列的例子:

<div class="row"> 
    <div class="span4">...</div> 
    <div class="span3 offset2">...</div> 
</div> 

问题:

  1. 列加起来还不到12只共计7或者如果算上偏移:9。当时这只是一个不好的例子或什么?
  2. 为什么我要抵消任何东西?这只是为了更好地处理我的网站布局的内容?

回答

6

为了阐明Rob的说法,你缺少的是所有网格示例都使用了9列。原因是文档中的侧边栏(侧面导航)本身占用了3列。

引导文档的整个宽度是12列,侧面导航减3,这为网格演示留下了9列。合理?

+0

好的,假设这段代码基于Bootstrap文档的主要内容。那应该是9,而不是4 + 3 = 7。偏移计数是否也是? 4 + 3 + 2 = 9? – StackOverflowNewbie

+0

这是正确的,偏移量也是如此。将偏移量视为空列。每个偏移增量等于一个.span1。所以.offset2 = .span2 – jonschlinkert

2

侧边栏是一个span3。所以整个页面宽度加起来就是12.它显示的内容部分只是一个span9。

+0

对不起。侧栏是span3如何使宽度增加到12? – StackOverflowNewbie

+0

因为整个页面宽度是12列。侧边栏是3列,主要内容部分是9列。因此,主要内容部分中的任何内容最多只能添加9.如果您要在一个范围内放置更多列,则相同。3.仅适用于3列,而不是12。 – Rob

+0

您是如何确定主要内容部分为9 ?我所看到的所有内容都是span4,span3和offset2。我的疑惑是这些数字并不等于12. – StackOverflowNewbie