safari会放大字号小于16px的可编辑元素，需确保input、textarea、select、[contenteditable]等元素的最终渲染font-size≥16px且同级设置-webkit-text-size-adjust: 100%，并配合viewport中maximum-scale=1.0生效。

为什么写了 font-size: 16px 还会放大

因为 Safari 检查的是最终渲染的字号，不是你写的那行 CSS。常见失效场景包括：
• html 根元素设了 font-size: 10px，再写 input { font-size: 1.6rem } → 实际是 16px，但浮点计算可能落到 15.99px
• 父容器有 font-size: 0.875em，子 input 继承后掉到 14px 以下
• 用了 clamp(14px, 4vw, 18px)，在 320px 宽度下 4vw = 12.8px
• 第三方 UI 库（如 Vant、Ant Design Mobile）动态注入内联样式，覆盖了你的声明
必须用 Safari 真机调试，打开「Computed」面板直接看 font-size 值，确认是 ≥16px 的绝对像素值

input、textarea、select 和 [contenteditable] 都要覆盖

iOS 不只检查 input，所有能唤起键盘的元素都可能触发放大：
• select 下拉框
• textarea 多行输入
• 带 contenteditable="true" 的 div 或 span（比如 Quill、Tiptap 编辑器根节点）
• 某些框架封装的输入组件（如 Vue 的 v-model 绑定的可编辑区域）
推荐一次性兜底写法：

CSS婚礼策划服务机构宣传网站模板

CSS婚礼策划服务机构宣传网站模板是一款适合提供婚礼策划和婚庆服务机构宣传网站模板下载。提示：本模板调用到谷歌字体库，可能会出现页面打开比较缓慢。

下载

input,<br>textarea,<br>select,<br>[contenteditable] {<br>  font-size: 16px !important;<br>}

别漏掉 :focus 伪类——某些框架在聚焦时动态加 class，可能导致字号回落

-webkit-text-size-adjust: 100% 必须和 font-size 同级写

这个属性不是“禁用缩放”，而是阻止 Safari 对文本做二次字号重计算。它只在 font-size ≥ 16px 时才起效：
• 别写在 body 或 html 上，否则正文小字也变难读
• 必须和 font-size: 16px 同级作用于表单元素，例如：

input,<br>textarea {<br>  font-size: 16px !important;<br>  -webkit-text-size-adjust: 100%;<br>}

• 不要用 none：iOS 10+ 已废弃，部分版本反而失效
• 100% 是最稳妥取值，不影响可访问性

meta name="viewport" 里 maximum-scale=1.0 才是关键

user-scalable=no 单独写无效，iOS Safari 会忽略它。真正起效的是 maximum-scale=1.0 和 minimum-scale=1.0 的组合：
• 正确写法：<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
• 多个 meta name="viewport" 标签时，只有第一个生效
• 某些 Cordova/Ionic 插件会动态重写 viewport，覆盖你写的初始值
• 把该标签放在 最顶部，不依赖 JS 注入
注意：shrink-to-fit=yes 已废弃，现代 iOS 不识别

真机调试时直接看 Computed 值，比猜配置靠谱得多；最容易被忽略的，是字号在继承链或响应式单位下的实际计算结果，而不是你写了多少行 font-size。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！