1. html5在低版本浏览器如何兼容（ie8）?
    解决：引入html5shiv.js
  2. 只要做移动端的项目，必须要加入meta
    强制让文档与设备的宽度保持1：1,对页面设置不能进行缩放：
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  1. 移动端中的图片会出现模糊的现象
    由于手机分辨率小，如果按照分辨率来显示网页，字就会很小。想要让图片在手机里显示的清晰，可以使用二倍图。
  2. 移动端纯数字的键盘type是哪个值？
    <input type="tel">
  3. 在ios中，输入框点进去之后会弹出首字母大写，应如何取消？
    autocapitalize=‘off’
  4. 在移动端开发中，某些设备会存在点击img标签，图片呈现预览模式，但是我们没有给图片添加任何事件这是移动端浏览器的默认行为，解决方式如下：
  • 在img标签上添加 οnclick="return false"
  • 图片用背景图的方式插入：background: url(a.png) no-repeat;
  • 使用js事件阻止默认行为
img.addEventListener('click', function(e){
   e.preventDefault(); 
})
  1. 解决移动端出现弹窗背景禁止滚动
$(“.zzc”).on(“touchmove”,function(){
　　　　event.preventDefault();
});
注意：.zzc是遮罩层的名字
  1. IOS移动端点击事件有300ms的延迟，往往会造成按钮点击延迟甚至是点击失效。怎么解决？
    这是由于区分单击事件和双击屏幕缩放的历史原因造成的。
    解决方式：
  • fastclick可以解决在手机上点击事件的300ms延迟
  • zepto的touch模块，tap事件也是为了解决在click的延迟问题
  • 触摸屏的相应顺序为touchstart–>touchmove–>touchend–>click，也可以通过绑定ontouchstart事件，加快事件的响应，解决300ms的延迟问题
  1. 在一些情况下，对非可点击元素（label，span）监听click事件，iso下不会触发，css增加cursor：pointer就搞定了。
  2. h5底部输入框被键盘遮挡的问题，当输入框在最底部，点击软键盘后输入框会被遮挡。可采用如下方式解决
var oHeight = $(document).height(); //浏览器当前的高度
$(window).resize(function(){
    if($(document).height() < oHeight){  
       $("#footer").css("position","static"); 
    }else{ 
       $("#footer").css("position","absolute"); 
    } 
});
  1. 不让 Android 手机识别邮箱
    <meta content="email=no" name="format-detection" />
  2. 禁止 iOS 识别长串数字为电话,默认情况下，设备会自动识别任何可能是电话号码的字符串。
    <meta content="telephone=no" name="format-detection" />
  3. 禁止 iOS 弹出各种操作窗口
    -webkit-touch-callout:none
  4. iOS 系统中文输入法输入英文时，字母之间可能会出现一个六分之一空格可以通过正则去掉
    this.value = this.value.replace(/\u2006/g, '');
  5. fixed定位缺陷
    ios下fixed元素容易定位出错，软键盘弹出时，影响fixed元素定位
    android下fixed表现要比iOS更好，软键盘弹出时，不会影响fixed元素定位
    ios4下不支持position:fixed
    解决方案： 可用iScroll插件解决这个问题
  6. 防止手机中网页放大和缩小。
    使用viewport使页面禁止缩放。 通常把user-scalable设置为0来关闭用户对页面视图缩放的行为
    但是为了更好的兼容，我们会使用完整的viewport设置。
  7. 上下拉动滚动条时卡顿、慢
body {
  -webkit-overflow-scrolling: touch;
  overflow-scrolling: touch;
}
  1. 禁止复制、选中文本,解决移动设备可选中页面文本
Element {
  -webkit-user-select: none;
  -moz-user-select: none; -khtml-user-select: none; user-select: none; 
}
  1. 长时间按住页面出现闪退
element {
  -webkit-touch-callout: none;
}
  1. iphone及ipad下输入框默认内阴影
Element{
  -webkit-appearance: none; 
}
  1. IOS键盘字母输入，默认首字母大写
<input type="text" autocapitalize="off" />
  1. 移动端 HTML5 audio autoplay 失效问题
    由于自动播放网页中的音频或视频，会给用户带来一些困扰或者不必要的流量消耗，所以苹果系统和安卓系统通常都会禁止自动播放和使用 JS 的触发播放，必须由用户来触发才可以播放。
    解决方法思路：先通过用户 touchstart 触碰，触发播放并暂停（音频开始加载，后面用 JS 再操作就没问题了）。
    解决代码：
document.addEventListener('touchstart', function () {   
   document.getElementsByTagName('audio')[0].play(); 
   document.getElementsByTagName('audio')[0].pause(); 
});
  1. 某些Android手机圆角失效
    background-clip: padding-box;
  2. 手机页面通常在第一次加载后会进行缓存，然后每次刷新会使用缓存而不是去重新向服务器发送请求。如果不希望使用缓存可以设置no-cache。
    <meta http-equiv="Cache-Control" content="no-cache" />
  3. ios 设置input 按钮样式会被默认样式覆盖
input,
textarea {
  border: 0; 
  -webkit-appearance: none; 
}