前端面试题

IOS和安卓常见兼容问题

1.IOS下input默认样式（圆角、阴影）

解决方案:

input {
  -webkit-appearance: none;
  border-radius: 0;
  border: 1px #ccc solid;
}

2.在IOS下页面滑动卡顿，Andoid没问题

解决方案:

body {-webkit-overflow-scrolling:touch; overflow-scrolling: touch;}

3.input type改为button

问题：当input改为button，disabled为true，会出现背景色异常（其实就是禁用的样式）

解决方案:

把input的disabled改为readonly
opacity：1

4、input type=text切换到英文输入法IOS下的问题

解决问题

input添加autocapitalize属性

5.禁止数字自动识别为电话号码

问题:

1212312312321323

解决方案

6：使用 $(window).resize(...) 无效。

可能由于框架或插件原因，有时候$(window).resize(...)不生效。

解决方案：使用 window.onresize = function () {...} 即可。

7：gif动图附近会闪烁

问题描述：有些手机上，gif动图图片附近会有闪烁现象；

经测试发现，手机卡顿越严重，闪烁越明显，所以基本确定是由于手机卡顿造成的；

解决办法：进可能减少gif动图帧数量，或直接忽略这些卡顿的手机（通常是比较老的机型/系统）。