移动端兼容性问题

1. overflow: auto; IOS手机滚动卡顿

-webkit-overflow-scrolling: touch; //有回弹效果 

2. 动画定义3D启用硬件加速

3. 盒子边框最低只能是1px

4. a标签或者button标签等，点击后会有蓝色边框；去掉难看的点击的高亮效果

* {
  outline: none;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}

5. calc的兼容性处理

CSS3中的calc变量在iOS6浏览器中必须加-webkit-前缀，目前的FF浏览器已经无需-moz-前缀。
Android浏览器目前仍然不支持calc，所以移动端不建议使用calc

6. 微信浏览器中跳转新网页：window.locaition.href 无效；

var nextPage = document.createElement("a");
     nextPage.setAttribute('href','http://www.baidu.com');
     nextPage.click();

7. 移动端点击300ms延迟

8. 移动端 HTML5 audio autoplay 失效问题

这个不是 BUG，由于自动播放网页中的音频或视频，会给用户带来一些困扰或者不必要的流量消耗，所以苹果系统和安卓系统通常都会禁止自动播放和使用 JS 的触发播放，必须由用户来触发才可以播放。

9. 禁止ios和android用户选中文字；禁止ios 长按时不触发系统的菜单，禁止ios&android长按时下载图片

div {
  -webkit-user-select:none；
  -webkit-touch-callout: none
}

10. ios下取消input在输入的时候英文首字母的默认大写

<input autocapitalize="off" autocorrect="off" />