移动端兼容性问题总结（一）

时间：2023-04-05 22:44:10 HTML5

原文地址：https://luoyangfu.com/article...input键盘类型问题描述：在android上只需要换类型就可以换键盘类型，但是在ios上无效。解决方法：需要在form元素的外层添加一个

标签才能生效。文字在android之上。问题描述：在android上，小于12px的文字上下居中，android文字显示在最上面。设置字体为11px，上下居中。方案一：字体大小：22px；填充：10px40px；边框半径：40px；行高：22px；缩放：0.5；方案二：字体大小：22px；填充：10px40px；边框半径：40px；变换：比例（0.5）；变换原点：0%0%；这里是通过先放大再缩小的方式来解决这个问题的（这里应该避免使用小于12px的字体高度）2019.07.11记录方法1，使用2如果设计成双可能会失败。方法二会占用当前空间，可以通过设置position:absolute来解决。补充解决方案：border-radius:2px；字体大小：10px；填充：2px5px；行高：正常；框大小：边框框；ios输入法顶起页面问题描述：页面被输入法顶起，导致滚动无法锁定解决方法：在当前容器外面再包裹一层，使用position:fixed解决这个问题，做一个在容器内滚动。iconfonttransformInvalidrelatedoperations说明：rotateAninvalidangle解决方法：需要直接操作iconfont::before伪类，不能直接操作iconfont。icon::before{transform:rotate(90deg);}ios下document.execCommand(copy)无效。在ios下直接使用input.select()是无效的。您需要使用以下方法：input.setSelectionRange(0,data.length)来选择文本的长度。

上一篇：好程序员web前端学习路线大厂面试题详解

下一篇：如何使用Flannel搭建跨主机互联的容器网络

移动端兼容性问题总结（一）相关文章