安卓、IOS兼容性
安卓、IOS兼容性
1、IOS下input默认样式(圆角、阴影)
解决方案
input {-webkit-appearance: none;border-radius: 0;border: 1px #ccc solid;}
2、在IOS下页面滑动卡顿，Android没问题
解决方案
body { -webkit-overflow-scrolling:touch; overflow-scrolling: touch;}
3、input type 改为button
问题
当input type为button，disabled为true，会出现背景色异常(其实就是禁用的样式)
解决方案
- 把input的disabled改为readonly
- opacity：1
4、input type=text切换到英文输入法IOS下的问题
解决方案
input添加autocapitalize属性
<input class="SmallFour" type="text" autocapitalize="off" />
5、禁止数字自动识别为电话号码
这个比较有用，因为一串数字在iphone的部分浏览器上会显示成蓝色，样式加成别的颜色也是不生效的。亲测，在微信内部浏览器没问题，但是在safari上有问题，IOS系统版本12.1.4
解决方案
<meta name="format-detection" content="telephone=no" />
6、input type=number之后，pc端出现上下箭头
解决方案
input::-webkit-inner-spin-button {-webkit-appearance: none !important;margin: 0;}
7、input type=number之后，pc端出现上下箭头
解决方案
input::-webkit-inner-spin-button {-webkit-appearance: none !important;margin: 0;}
柔情只为你懂
ゝ一世哀愁。
超、凢脫俗
Bertha 。
还没有评论，来说两句吧...