一、 苹果全面屏底部有留白
添加 viewport 设置：
meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover"
二、 侧边栏收起后再展开底部产生横向滚动条
利用 width: calc(100% - 容器宽度) 解决。
三、 input type="number" 兼容性问题
① 移动端 input type="number" 在 iOS 不生效
解决办法：
input type='number' pattern="[0-9]"
在 iOS 弹出数字键盘，不能输入其他。但是在 Android 中还是可以输入 . + 等符号，需要监听事件然后 replace，可以使用正则。
② maxlength 不起作用
用 oninput 事件来进行控制：
input oninput="if(value.length>11)value=value.slice(0,11)"
③ 不要有上下箭头
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
input[type="number"] {
-moz-appearance: textfield;
}四、input type=file 兼容性问题
input type=file 时，不能加 accept 的属性，荣耀 10 手机不支持，会导致图片无法上传。
五、华为手机上传视频到服务器不起作用
解决方法：
var formData = new FormData();
formData.append("fileInfo", $("file")[0].files[0]);
$.ajax({
async: false,
url: '/uploadFileNew',
type: 'POST',
dataType: 'json',
data: formData,
processData: false, // 使数据不做处理
contentType: false, // 不要设置 Content-Type 请求头
success: function (returndata) {
if (returndata.code == "200") {
} else {
popupReminder("上传文件失败");
}
},
error: function () {
popupReminder("上传文件失败,服务器出错");
}
});六、iOS 无法触发点击事件
解决方法：
1、将 click 事件直接绑定到目标元素（即 .target）上
2、将目标元素换成 a 标签或者 button 标签等
3、将 click 事件委托到非 document 或 body 的父级元素上
4、给目标元素添加 CSS 属性 cursor: pointer
七、 iOS 系统 input 的 readonly 属性无效
用 -webkit-user-select: none 样式解决。
八、微信小程之VantUI 的 button 自带点击效果
小程序若使用 VantUI 的 button 时，会自带一个点击之后的效果（点击时按钮颜色变灰），若要去掉这个样式，需要在对应的页面样式中添加：
.van-button::before {
color: FFF !important;
background-color: transparent;
opacity: 0 !important;
}九、微信小程 之处理 image 跟 view 标签上下间隙问题
解决方法：display: block;
十、微信小程之小程序 button 点击会出现灰背景
添加 hover-class="btn-hover" 属性即可去除点击时背景色。