最稳定解法是为input、textarea、select和[contenteditable]设font-size:16px!important，并配viewport中maximum-scale=1.0与user-scalable=no；因ios safari硬编码仅认16px为防缩放阈值，且需覆盖:focus态及动态注入场景。
直接给 input、textarea、select 和 [contenteditable] 元素设 font-size: 16px !important，再配合 viewport 中 maximum-scale=1.0 与 user-scalable=no，是目前最稳定、兼容性最好的解法。纯靠禁用缩放或 JS 动态改 viewport，容易漏掉触发点，也治标不治本。
为什么必须写 font-size: 16px，而不是 15px 或 17px
iOS Safari 的放大逻辑是硬编码判断：只要元素最终 computed font-size 小于 16 CSS 像素，就强制缩放视口。这个值不是你写的声明值，而是浏览器计算后的渲染结果——所以 15.99px、1.143rem（在 html { font-size: 14px } 下）都会触发。
- 16px 是唯一被所有 iOS 版本（包括 iOS 17+）一致认可的安全整数阈值
- 用
rem或em时，必须确保根字号或继承链最终 ≥16px，否则无效 - 第三方 UI 库（如 Vant、Tiptap）可能动态注入内联样式，覆盖你的设置，
!important几乎是必需的
哪些元素和状态必须一并覆盖
只写 input 和 textarea 是不够的。iOS 同样会检测以下元素的 font-size：
-
select下拉框（常被忽略） - 所有带
contenteditable属性的容器（哪怕只是<div contenteditable>）<li>富文本编辑器根节点（Quill、Vue 的 <code>v-model绑定的div[contenteditable]） - 必须同时覆盖普通态和
:focus态，防止某些框架在聚焦时动态加 class 导致字号回落
推荐兜底写法：
input, textarea, select, [contenteditable] { font-size: 16px !important; }
input:focus, textarea:focus, select:focus, [contenteditable]:focus { font-size: 16px !important; }
viewport meta 标签怎么写才真正生效
maximum-scale=1.0 单独存在没用，它必须和 user-scalable=no 同时出现，且 user-scalable 必须是字符串 no（不是 false 或空值）。更重要的是，这个 meta 标签必须在 中静态存在，不能靠 JS 动态插入——部分 iOS 版本根本不识别。
- 正确写法：
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=no"> -
initial-scale=1.0和minimum-scale=1.0属于冗余项，可省略 - 缺失
width=device-width会导致整个 viewport 解析异常，让 scale 设置失效 - 该标签是前提条件：如果它没生效，后面所有 CSS 都白搭
容易被忽略的动态场景和兼容细节
静态页面加个 CSS 就完事？现实里几个坑很隐蔽：
- Vue/React 中通过
v-html或dangerouslySetInnerHTML插入的富文本，其内部[contenteditable]不受全局样式影响，需用:deep([contenteditable])（Vue）或* /deep/ [contenteditable]（旧版）穿透作用域 -
-webkit-text-size-adjust: 100%只有在font-size ≥ 16px时才起效，且必须和字体声明写在同一选择器里，不能只挂在html或body上 - 某些 reset.css 或 Bootstrap 默认把
box-sizing设为content-box，导致width: 100%实际内容区变窄，Safari 会判定“太窄”而放大——建议统一加box-sizing: border-box !important到表单元素
真正复杂的地方不在代码量，而在「computed font-size 是否真的稳稳 ≥16px」——每次改了 rem 基础值、用了新组件库、或者加了动态内联样式，都得重新验证一遍这个数字。
