Web前端知识培训：栅格系统的行和列

　　Bootstrap栅格系统用于将页面布局划分为等宽的列，随着屏幕或视口尺寸的增加，系统会自动分为1～12列。

　　栅格系统用于通过一系列的行(row)与列(column)的组合来创建页面布局。开发者可以将内容放入这些创建好的布局中，然后通过列数的定义来模块化页面的布局。

　　与流式布局和弹性盒布局不同的是，栅格系统通过一系列的行(row)与列(column)的组合来创建页面布局，页面的内容可以放入这些创建好的布局容器中，并且会根据父元素盒子(布局容器)尺寸的大小进行适当调节，从而达到响应式页面布局的效果。

　　Bootstrap栅格系统的基本使用方式如下。

　　(1)Bootstrap栅格系统为不同屏幕宽度定义了不同的类，使用非常方便，直接为元素添加类名即可。

　　(2)行(row)必须包含在布局容器.container类或.container-fluid类中，以便为其赋予合适的排列(alignment)和内补(padding)。

　　(3)通过行(row)可以在水平方向创建一组列(column)，并且只有列(column)可以作为行(row)的直接子元素。例如，可以使用3个类名为col-xs-4的div元素来创建3个等宽的列。

　　(4)行(row)使用类名row定义，列(column)使用类名col-*-*定义，内容应当放置于列内，列大于12时，将会另起一行排列。

　　需要注意的是，Bootstrap栅格系统包含了易于使用的预定义类，还有强大的mixin用于生成更具语义的布局，读者可以查看官方文档进行学习。