Bootstrap里CSS问题

Question

1. 为什么.container要加上padding-left:15px,而.row要加上margin-left:-15px去抵消，从而container和row的边界是在一起的。如果想到这样的效果，两个元素都不加上padding和margin不是直接就可以了？

2. .container的内的直接子元素都是.row吧？这样才符合Bootstrap提出的栅格化布局

Answer 1

第一个问题应该是十二栏布局的时候就已经决定好了的。这个十五个像素的gap应该可以在less 见里面去调整的.在我看来更多的是提供的一种思路啊不是你一定要用它。
第二个问题 container 直接直接子元素数也可以不是row。
。当多个元素要去水平排列的时候才会用row
而且row在我看来应该是更多的是为了自适应布局存在的。

Answer 2

container提供一个水平方向的 padding，使其内部的内容不会接触到浏览器的边界，大小为15px。同时 row 还有一个很特殊的地方，就是左右各有 －15px 的margin而每个column 也会有15px的水平方向的 padding。column嵌套在row内部。

由于 row 的 margin 为－15px，那么位于两边的 column 就碰到了 container 的边界。但是 colunmn 本身又有 15px 的 padding 使得它其中的内容并不会碰到 container，同时 不同column的内容之间就有了30px的间隔了。

具体的看这里bootstrap-栅格系统