直接改font-size到16px及以上是最稳定方案；因iOS Safari在input/textarea等元素计算字号≤15px时会强制放大视口，这是不可拦截的系统级可访问性行为，须确保最终渲染值≥16px并用!important防止覆盖。
直接改 font-size 到 16px 及以上，是最稳定、兼容性最好、副作用最小的方案。其他方法要么 iOS 新版本已失效，要么会干扰正常手势或缩放逻辑。
为什么 font-size 小于等于 15px 会触发放大
iOS Safari 的底层逻辑是：当 input 或 textarea 的计算后字号 ≤ 15px 时，系统判定“文字太小、看不清”，自动将整个视口缩放到约 1.2–1.5 倍，让输入框区域更易操作。这不是 bug，是苹果硬编码的行为，无法通过 JS 拦截或覆盖。
这个判断发生在 focus 时刻，且只针对以下元素：input、textarea、select（部分版本），不包括 contenteditable 或自定义输入组件。
- 必须是「计算后」的字号，即经过继承、
em/rem计算、媒体查询生效后的最终值 -
font-size: 15px、font-size: 0.9375rem（在 16px 基准下）、font-size: calc(1rem - 1px)都会触发 - 即使父级设了
font-size: 16px，子元素显式写font-size: 14px，仍会触发
如何用 CSS 精准规避（推荐写法）
只需一条规则，覆盖所有可能触发的表单控件：
立即学习“前端免费学习笔记（深入）”；
input,
textarea,
select,
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"] {
font-size: 16px !important;
}注意几点：
- 必须加
!important—— 很多 UI 库或重置样式（如 Normalize.css）会设font-size: 100%或font-size: 1rem，在 iPhone 上这等于 16px，但某些字体度量偏差可能导致实际渲染略小，!important是保险做法 - 不要只写
input, textarea——select在 iOS 16+ 也会触发放大，type="search"在 Safari 中有独立放大逻辑 - 避免用
em/rem动态单位 —— 如果根字体被 JS 修改（比如根据 dpr 动态设置），可能意外掉回 15px 临界点
viewport meta 标签为什么不能单独解决问题
很多人试过这样写：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
但它在 iOS 10+ 已基本失效。原因在于：
-
user-scalable=no只禁用「用户主动双击/捏合缩放」，不影响系统自动聚焦放大 - iOS 会忽略该属性对
focus行为的约束，这是 Safari 的明确设计选择 - 若同时用了
maximum-scale=1.0，反而可能导致键盘弹起后页面无法滚动、fixed 元素错位等衍生问题
所以 viewport 标签只能作为辅助（比如防止误触双击），不能替代字号修复。
容易被忽略的两个细节
一是 line-height 不影响放大判定，但若设得过小（如 line-height: 1），会导致光标位置偏移、文字贴顶，间接让用户觉得“输入框异常”，误以为是放大问题；二是 iOS 对 font-family 敏感 —— 某些无衬线字体（如 -apple-system）在字号刚好 15px 时，字形渲染宽度可能触发边界判断，所以宁可设成 16px，别卡临界值。
