Bootstrap入门书籍之（三）栅格系统

栅格系统是Bootstrap中的核心，正是因为栅格系统的存在，Bootstrap才能有着如此强大的响应式布局方案。栅格系统中的列是通过指定 1到12 的值来表示其跨越的范围。我们在第一个和最后一个列因为 双填充 的存在， 实际上对于内容的隔离 已经到了 30px 。这样命名就体现了这几种class适应的屏幕宽度不同。通过源码可以发现，如下：从这些CSS代码也就不难发现，Bootstrap中每一列所占的宽度，以及为何在列数设置超过12时，超过部分会换行显示了。这些类实际是通过使用 * 选择器为当前元素增加了左侧的边距。Bootstrap仅通过设置left和right来实现定位效果。代码如下我们可以发现列的位置已经发生了改变Bootstrap框架的网格系统还支持列的嵌套。