bootstrap 列偏移 列排序 兼容引入 字体图标组件的使用

布局容器 

container类

响应式布局容器 固定宽度

屏幕>=1200px  宽度为1170px

屏幕>=992px  宽度为970px

屏幕>=768px  宽度为750px

container-fluid类

流式布局容器 百分百宽度 适合移动端开发

栅格系统  12列

注意：

行必须放到container布局容器里面

一个盒子可以添加多个类名

做列嵌套最好加一个行 row 可以取消父元素的padding值 行高和父级一致

如份数大于12，多余的一列会另起一行显示 等于12，充满container  小于12 会出现空白

实现列的平均划分，需要给列添加类前缀

col-xs    超小屏幕  <768px(手机)

col-sm   小屏设备  >=768px(平板)

col-md 中等屏幕 >=992px(桌面显示器)

col-lg     宽屏设备 >=1200px(大桌面显示器)

列偏移 offset

列向右偏移

列排序

pull   拉  往左侧拉

push 推 往右侧推

响应式工具 

hidden-屏幕宽度

visible-屏幕宽度

兼容引入

 <!--[if lt IE 9]>

      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>

      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

    <![endif]-->

'

字体图标

在对应的文档中，找自己要的图标，复制类名，给需要的元素