首页 > 代码库 > 移动端常见兼容性问题及解决办法
移动端常见兼容性问题及解决办法
-
当使用
transform:translate3d(-50%,-50%,0)
居中弹框(div)时,在pc端,内部的文字会模糊。
解决办法:给body定义样式body{ font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif; }
-
用
position:absolute/fixed;
把一个按钮固定在页面的底部,在android系统中,当调用输入法时,该按钮会被顶起
解决办法:使用媒体查询@media screen and (max-width:400px){}
当页面高度小于某一个值时,给元素一个top值 -
IOS系统调用第三方输入法时,系统无法监测到input的
input、focus、change、blur
事件
解决办法:计算input值的length
的长度,判断input的值是否变化 -
不同浏览器默认margin,padding不同。
*{margin:0;padding:0;}
- 不同浏览器的最小字体不同,有的是10px,有的是12px
解决办法:设置字体时,不要小于12px,如果一定要小于12px,使用transform:sacle()
进行缩放 - 透明度opacity
解决办法:IE8 以及更早的版本支持替代的 filter 属性。例如:filter:Alpha(opacity=50)
- 文字两端居中
text-align:justify;text-align-last:just;
在移动端不起作用
解决办法:使用 ;代替空格
移动端常见兼容性问题及解决办法
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。