移动端常见兼容性问题及解决办法
1.当使用transform:translate3d(-50%,-50%,0)居中弹框(div)时,在pc端,内部的文字会模糊。
解决办法:给body定义样式
1 2 3 | body{ font-family : Helvetica Neue, Helvetica ,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun, sans-serif ; } |
2.用position:absolute/fixed;把一个按钮固定在页面的底部,在android系统中,当调用输入法时,该按钮会被顶起
解决办法:使用媒体查询@media screen and (max-width:400px){}当页面高度小于某一个值时,给元素一个top值
3.IOS系统调用第三方输入法时,系统无法监测到input的input、focus、change、blur事件
解决办法:计算input值的length的长度,判断input的值是否变化
4.不同浏览器默认margin,padding不同。
1 | *{ margin : 0 ; padding : 0 ;} |
5.不同浏览器的最小字体不同,有的是10px,有的是12px
解决办法:设置字体时,不要小于12px,如果一定要小于12px,使用transform:sacle()进行缩放
6.透明度opacity
解决办法:IE8 以及更早的版本支持替代的 filter 属性。例如:filter:Alpha(opacity=50)
7.文字两端居中text-align:justify;text-align-last:just;在移动端不起作用
解决办法:使用 ;代替空格
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· C++代码改造为UTF-8编码问题的总结
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· What?废柴, 还在本地部署DeepSeek吗?Are you kidding?
· 程序员转型AI:行业分析
· 为DeepSeek添加本地知识库
· 深入集成:使用 DeepSeek SDK for .NET 实现自然语言处理功能
· .NET程序员AI开发基座:Microsoft.Extensions.AI