禁用用户缩放需完整设置viewport meta标签：width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no；同时为input/textarea设font-size:16px，加-webkit-text-size-adjust:100%，必要时用js拦截多点触控。
viewport meta 标签必须禁用 user-scalable
禁止缩放的核心是控制 <meta name="viewport"> 的行为，关键在 user-scalable 参数。只要它设为 no，且配合合理的 maximum-scale 和 minimum-scale，就能有效阻止用户双指缩放或 pinch 手势。
常见错误是只写 user-scalable=no 却漏掉缩放边界，某些 iOS 版本（尤其是 Safari 15.4+）会忽略孤立的 user-scalable，导致实际仍可缩放。
推荐写法：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
-
initial-scale=1.0确保页面以自然比例加载 -
maximum-scale=1.0和minimum-scale=1.0形成缩放锁死区间，比单靠user-scalable=no更可靠 - 不要省略
width=device-width，否则部分 Android 浏览器可能 fallback 到桌面视口宽度，引发布局错乱
iOS Safari 有特殊限制，仅靠 meta 不够
iOS 13.4+ 尤其是 iOS 16/17 的 Safari 对 user-scalable=no 做了更严格的策略限制——即使 meta 写全，长按文字、触发选择框、或聚焦 <input> 时仍可能意外放大。这不是 bug，而是 Apple 强制保障可访问性的设计。
应对方式不是硬刚系统，而是协同处理：
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 给所有
<input>、<textarea></textarea>加style="font-size: 16px;"（iOS 认为小于 16px 的文本会自动放大） - 避免设置
font-size小于16px的全局样式，特别是body或根元素 - 如需彻底禁用选中放大，可加
-webkit-text-size-adjust: 100%;到html或body
JavaScript 补充拦截（慎用，仅作兜底）
meta + CSS 能解决 95% 场景，但极少数定制 WebView 或老旧安卓内核仍可能绕过。此时可用 JS 监听缩放手势做阻断，但注意：这不是标准方案，仅用于补漏。
监听 touchstart 并检测多点触控是最轻量的方式：
document.addEventListener('touchstart', function (e) {<br> if (e.touches.length > 1) {<br> e.preventDefault();<br> }<br>}, { passive: false });
- 必须传
{ passive: false }，否则e.preventDefault()在现代浏览器中无效 - 仅拦截多点 touchstart，不影响单点点击和滚动
- 不能替代 viewport meta，否则页面初始缩放失控，且对键盘弹出等场景无作用
别忘了测试真机，模拟器不反映全部问题
Chrome DevTools 的 device mode 只能模拟 viewport 行为，无法复现 iOS 文本自动放大、长按选中、或 WebView 内核差异。真正验证是否生效，必须在真实 iOS 和主流安卓机型上手动双指张开/捏合、长按文字、点击输入框测试。
最容易被忽略的是：某台设备上“看起来没缩放”，其实只是因为当前 scale 恰好卡在 1.0，而用户稍一用力就突破了边界——所以测试时要刻意尝试“极限操作”，而不是点两下就结束。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
