1、移动端适配方案
为了保证h5页面在不同大小的屏幕上展示基本一致
简单来说三种方案：
1、meta标签设置像素级别的缩放
2、使用rem单位
3、vw/vh
参考文档：超详细讲解H5移动端适配
2、ios设置SF Pro Display字体不生效
（1）字体访问限制：Apple 的系统字体（如 SF Pro Display）在 Web 环境中不能直接通过字体名称访问。这是出于版权和安全考虑。
（2）字体名称不准确：字体名称必须与系统中安装的字体名称完全匹配，包括空格和大小写，才能正确应用
不知道该用SF Pro Display还是SFProDisplay或者SFProDisplay-Medium，项目中有些历史的组件用了这个字体，我改成和他们一样的写法也不生效，也不知道他们这些页面生效没。。。
（3）webview容器中没有这个字体资源，可以下载后自行引入，但是这个字体有版权，商业用途需收费，无法通过下载解决
解决方案有以下几种：尝试加了个-apple-system后生效了（由于本地调试看不出效果，每次改了只能部署了打开手机测试，所以其他方案也没尝试）
3、安卓/ios键盘唤起时页面表现不同
1、安卓机唤起键盘时会调整视口大小，页面不会自动滚动，一般需要手动处理确保输入框可见
2、ios机唤起键盘时，视口大小不变，但可见区域大小会改变，页面会自动滚动使获取焦点的输入框可见
keyboardWillShow 和 keyboardWillHide 事件在标准web api中是不存在在，因此h5中要监听键盘事件一般使用
resize 事件（浏览器视口大小变化时触发），仅安卓机会触发，ios在键盘唤起和隐藏时不会改变视口的大小，而是调整可见区域
visualViewport的resize 事件，ios在键盘唤起和隐藏时会触发，但由于它是较新的 API，可能需要考虑兼容性
focusin 事件（当输入框获得焦点时可能触发键盘）、focusout 事件（当输入框失去焦点时可能隐藏键盘）
主要体现在使用van-popup组件时遇到三个问题
1、若直接在弹窗底部固定定位两个按钮，当弹窗内容超出高度上下滑动时，按钮会跟随一起滑动
解决：将popup设置overflow:hidden，并在内容盒子和按钮盒子外层包一层超出滚动的盒子设置overflow:auto，给内容部分设置定高可以解决
2、键盘唤起和关闭时，安卓会出现按钮飞到键盘顶部展示
解决：安卓通过监听resize事件对按钮进行隐藏和展示
3、ios在打开键盘关闭键盘再打开键盘时，可能会出现高度为80%的弹窗高度溢出，变成整个页面高度
解决：尝试了多个可行方案暂未解决，可能是因为解决1导致的van-popup出现了滚动穿透到页面现象
