CSS—IOS的一些兼容性问题01
2021-07-30 本文已影响0人
cain07
1. 在IOS中select下拉框会出现黑背景
-webkit-appearance:none;
background:url() no-repeat right; /*自己添加下拉箭头*/
background-size:;
input框去阴影
-webkit-appearance:none;
2. 苹果手机滑动平缓效果
-webkit-overflow-scrolling:touch;
3.在IOS中input输入框光标会变得巨大
不要给input加高度,加padding撑开
4.ios 双击页面缩放 禁止
iOS10后Safari不再识别这个meta标签。所以得用js来hack一下:
禁用双指缩放:
document.documentElement.addEventListener('touchstart', function (event) {
if (event.touches.length > 1) {
event.preventDefault();
}
}, false);
禁用手指双击缩放:
var lastTouchEnd = 0;
document.documentElement.addEventListener('touchend', function (event) {
var now = Date.now();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false);
5.在IOS中li按下会有阴影效果
-webkit-tap-highlight-color: transparent;