ios safari 浏览器跳转页面没有自适应

今天开发遇到了一个问题,当用户点击浏览器中的表单进行注册时,表单元素会放大,随后跳转页面无法还原到初始状态。

这是因为如果 的 font-size 被设定为 16px 或更大,那么 iOS 上的 Safari

将正常聚焦到输入表单中。但是,一旦 font-size 等于或小于 15px,视图窗口就会放大并聚焦到该

(或许是因为苹果认为字体太小,因此它会放大以帮助你更清楚地看到自己在做什么)。这个设计是用来增强可访问性的。

所以如果要解决这个问题,请确保 的字体足够大。
或者是设置meta

javascript 复制代码
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

说明:

apple-mobile-web-app-capable 删除苹果的默认工具栏和菜单栏。

content 默认值为 no ,即正常显示。如果设置为 yes,Web应用会以全屏模式运行,可以通过只读属性

window.navigator.standalone 来确定网页是否以全屏模式显示。

相关推荐
CharlesYu018 小时前
前端性能优化的第一性原理,是不断缩短“用户发起意图 → 获得可用结果”之间的时间
前端
平头哥技术团队9 小时前
Day 21 _ 页内锚点_给每段起个 id,目录写 href=_#id_,点一下页面就滚到那一段
前端·html·html5
子兮曰10 小时前
Bun v1.4.1 深度解析:从 Zig 到 Rust,一场 11 天、64 个 AI 代理的语言迁徙
前端·后端·bun
人民广场吃泡面10 小时前
什么是AI Agent?它又能给前端带来哪些效率提升?
前端·人工智能
中科三方10 小时前
两家域名注册商资质被ICANN终止:企业域名资产安全再受关注
前端·网络·安全·域名
bug总结11 小时前
uniapp vue3全局方法注册使用
前端·javascript·uni-app
华无丽言11 小时前
如何在宜搭中实现获取子表中的字段值赋值到父表中?
前端·javascript·低代码
IT_陈寒12 小时前
Vue的computed属性竟然坑了我一把
前端·人工智能·后端
威斯软科的老司机12 小时前
通俗讲解 CNN 图像识别、向量 Embedding、Softmax 概率计算这三块的简化原理
前端·人工智能·ui·数字孪生
泯泷13 小时前
手搓JSVM第 12 篇:完整最小 JSVM 实现与源码设计复盘
前端·javascript·前端框架