前端移动web布局总结

1、  基于版心进行布局  1200px     单位 px

2、  栅格布局    响应式   根据不同的屏幕宽度  给盒子加载不同的css样式

      版心：  1200   992    768    640

      媒体查询： @media screen and (min-width:992px ) and (max-width:1199px){...}

      设置视口：

      <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0"/>

3、  移动端： 百分比布局  rem布局  伸缩布局

     百分比布局 ：宽度自适应

     rem布局：  宽高等比例缩放

4、 bootstrap框架：

      栅格系统 ：响应式     .container >.row >.col-sm- *n

   animate.css: css动画库

      使用  class="animated  flash";

   zepto-----jquery:

     jquery:使用与pc端 里面有大量的低版本兼容代码  ，不适合于移动端 所以了 zepto.js

     会用jquer 就会 zepto.js

   swiper.js 触屏滑动插件  参考API文档

   fullpage.js  原理是：监听鼠标滚轮事件，事件触发后 滚动一屏的高度