栅格化布局
什么是栅格化布局?
栅格化布局，将每行分为12份，其中[class="col-{@number}"]表示当前元素占用的行的份额
常用布局外层容器元素
[class="container-fluid"]:栅格化铺满整行
[class="container"]:常规栅格化布局，最大宽度为1200
[class="container-wide"]:常规栅格化布局，宽屏容器
[class="container-narrow"]:窄屏容器，屏幕最大宽度
[class="container-narrow-x"]:超窄屏容器，屏幕最大宽度
[class="container-narrow-x"]:超窄屏容器，屏幕最大宽度
常用容器下的行布局使用：[class="row"]
行下面的细胞容器元素如下：
预定义屏幕显示[col-1,col-2,.......col-12]
普通屏显[col-md-1,col-md-2,.......col-md-12]
宽屏屏显[col-lg-1,col-lg-2,.......col-lg-12]
窄屏屏显[col-sm-1,col-sm-2,.......col-sm-12]
超窄屏屏显[col-xl-1,col-xl-2,.......col-xl-12]
预留空白空间[col-space-1,col-space-2,.......col-space-12]