移动端与pc端的区别 及 ios的 兼容性问题

时间:2021-02-04 17:57:11

前言:这里移动端主要指 hybrid app 中的H5页面。app 中页面 样式和功能 的需求会更精细一点。

1、适配: 手机端的尺寸多样,3.5英寸的 iPhone4应该是最小的,只要考虑 兼容到iPhone4 就可以了。(iPhone4的用户量现在也很少,有时只要 兼容到iPhone5 就可以了)

   哪怕有比这个尺寸小的,都不是多人使用的。可能是个位数,甚至是没有。为数不多的几款这样的手机处理能力也很低下。       https://digi.tech.qq.com/a/20150312/011872.htm#p=1

   iPhone4 使用情况:iPhone4的系统, 现在的很多软件都运行不了。  https://www.pc841.com/shouji/iPhone/19249.html(系统升级后也会有问题,大部分用户是不会去升级的)  或  https://t.cj.sina.com.cn/articles/view/2972527830/b12d2cd60010084gl

2、软键盘: 智能机的键盘都是软键盘。应用中有呼起键盘和隐藏键盘的需求。

   呼起键盘:进入搜索页,要求键盘拉起。主要聚焦到input框就可以。(安卓上没有问题,ios上无效)

   隐藏键盘:目前 没有找到通过 js 控制键盘隐藏的方法。

3、屏幕高度变化:同一个手机,H5页面的 视口高度在键盘拉起和隐藏时,不一样的。拉起时,键盘部分的高度变成原生的内容了,H5容器高度就变小了。

   一般情况这个都不影响,但是如果底部有fixed定位的话。键盘拉起时,会把这块内容也移上去的,需要做一个判断进行隐藏。

 

 

安卓 和 ios 的兼容性:

1、input中文字的居中:input框有背景色时,这个问题就会体现出来。常规的居中好像两个都有问题。(移动端上 有背景色参考的 单行文本,一定要注意居中对齐。)

2、ios的页面有回弹的效果:js怎么禁用还不知道,如果js禁不掉,那就让整个页面一起动(即不要使用fixed定位,可以使用absolute相对于全屏的那个标签进行定位。这样页面移动,这个absolute定位的部分也跟着一起动了)。

3、