JavaScript>响应式布局与CSS样式和JS插件(轮播图)的使用方法

响应式布局：
同一套页面可以兼容不同分辨率的设备。

实现：依赖于栅格系统：将一行平均分为12个格子，可以指定元素占几个格子，

步骤：

    1.定义容器。相当于之前的table

        容器分类：

            1.container：两边有留白

            2.container-fluid：每一种设备都是100%宽度

    2.定义行，相当于之前的tr   样式：row

    3.定义元素，相当于之前的td，指定给元素在不同的设备上，所占的格子数目。    样式：col-设备代号-格子数目

        设备代号：

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

    sm：小屏幕 平板 (≥768px)

    md：中等屏幕 桌面显示器 (≥992px)

    lg：大屏幕 大桌面显示器 (≥1200px)

    注意事项：

        1.一行中如果格子数目超过12，则超出部分自动换行

        2.栅格类属性可以向上兼容。栅格类适用于屏幕宽度大于或等于分界点大小的设备

        3.如果真实设备宽度小于了设置栅格类属性的设备代码的最小值，会一个元素沾满一整行

 

CSS样式和JS插件

全局css样式：