美文网首页
ios手机端的兼容问题

ios手机端的兼容问题

作者: 执著_7a69 | 来源:发表于2017-09-18 23:44 被阅读183次

    1.去除ios页面的input、textarea的自带效果(阴影、等)

    input,textarea {-webkit-appearance:none;}

    2.iOS系统上常常能看到高斯模糊(Gaussian Blur)效果。(http://www.w3cplus.com/css3/advanced-css-filters.html)大漠大神的博客。

    backdrop-filter:blur(10px);只支持ios端;只作用于当前元素;

    到目前为止,仅有Safari浏览器支持,而且还需要添加前缀:-webkit-backdrop-filter

    3.-webkit-tap-highlight-color:rgba(255,255,255,0)可以同时屏蔽ios和android下点击元素时出现的阴影。备transparent的属性值在android下无效。

    4.border-radius:0   改掉ios默认的曲边框。

    5.

    当文本框只能输入数字是一个很常见的需求,比如电话号码,身份证号,卡号, 数量....等等只允许数字输入,为了更好的用户体验性,直接写出 启动数字键盘的需求,我和大多数人一样用this.style.imeMode='disabled';

    imeMode有四种形式,分别是:

    active 代表输入法为中文

    inactive 代表输入法为英文

    auto 代表打开输入法 (默认)

    disable 代表关闭输入法

    发现在Android手机上是不行的。

    解决办法:html5里的 input 的type属性可设置为 number  <input type="number" >弹出数字键盘

    相关文章

      网友评论

          本文标题:ios手机端的兼容问题

          本文链接:https://www.haomeiwen.com/subject/jppisxtx.html