user-scalable=no 单独使用无法禁用系统级缩放，必须与 maximum-scale=1.0、minimum-scale=1.0 共同设置才有效；fixed 元素在缩放后因锚定逻辑视口而错位，推荐改用 sticky 或监听 visualViewport 动态调整。
加 user-scalable=no 不能彻底禁用缩放，fixed 错位问题也不会消失。 它只是告诉浏览器“别响应双指手势”，但系统级缩放（如 iOS 的“更大字体”、Android 的“显示大小”）仍会触发，且 fixed 元素锚定的是逻辑视口坐标系，缩放后物理像素映射关系一变，位置就偏了。
为什么 user-scalable=no 单独用没用
它不是锁，只是提示。iOS 10+ Safari 和多数 Android Chrome 都会忽略这个声明，只要用户开了辅助功能里的“粗体文本”“更大的动态类型”或“强制缩放”，fixed 元素照样卡在缩放前的坐标里——你看到它没动，其实是它被“钉死”在旧视口逻辑尺寸上，而页面内容已按新比例重排。
-
user-scalable=no单独存在时，仅阻止双指捏合，对系统级缩放完全无效 - 缩放后
window.innerHeight变小，但fixed元素的top/bottom值仍按原始视口计算 - iOS Safari 尤其明显：缩放后 fixed 元素点击区域和视觉位置严重错位，常导致按钮点不中
meta viewport 必须配齐三参数
真要压制缩放行为，user-scalable=no 必须和 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"> - 顺序无关，但三者必须共存；漏掉
maximum-scale=1.0，iOS 上双击放大仍有效 - 注意：
maximum-scale=1.0会禁用双击放大，影响文字可读性，WCAG 合规检查可能直接报错
比禁缩放更靠谱的替代方案
与其硬扛缩放，不如换定位策略。fixed 在移动端本就是“高危布局”，尤其涉及底部操作栏、弹窗遮罩等关键交互层时，缩放+键盘+横竖屏切换三连击下基本不可靠。
- 优先用
position: sticky替代顶部/底部固定栏，它不受缩放影响，兼容 iOS 11+/Chrome 56+ - 必须用 fixed 时，监听
visualViewport动态调整：visualViewport.addEventListener('resize', () => { el.style.top = visualViewport.offsetTop + 'px'; })（仅现代浏览器支持） - 避免任何祖先元素带
transform、perspective、filter或will-change，它们会让 fixed 退化为 relative 定位
缩放不是 bug，是移动端真实使用场景。强行禁用反而损害可访问性；真正要修的，是把 fixed 当成“绝对可靠”的思维惯性——它在移动端从来就不是银弹。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
