移动端字体缩放问题怎么解决

移动端浏览器（尤其是 Android Chrome）会基于启发式算法自动调整文本大小以提升可读性，导致相同 CSS 字体声明在 DevTools 模拟器与真实设备上渲染不一致——典型表现为 Android 高密度屏上某些区域文字异常缩小，而 iOS 却无此问题，这并非 CSS 错误，而是浏览器层的默认行为；只需一行标准 CSS `text-size-adjust: none`（推荐作用于 `html` 根元素），即可彻底禁用该机制，让字体尺寸严格按设计意图呈现，同时兼顾现代浏览器兼容性与可访问性需求，是响应式开发中解决“看似相同却表现迥异”字体问题的精准、简洁、可靠方案。

移动端浏览器（尤其是 Android Chrome）会基于内容启发式算法自动调整文本大小，导致相同 CSS 字体声明在 DevTools 模拟器与真机上渲染不一致，text-size-adjust: none 可彻底禁用该行为。

移动端浏览器（尤其是 Android Chrome）会基于内容启发式算法自动调整文本大小，导致相同 CSS 字体声明在 DevTools 模拟器与真机上渲染不一致，`text-size-adjust: none` 可彻底禁用该行为。

这是一个在响应式开发中容易被忽视、却极具迷惑性的典型问题：两组 元素拥有完全相同的 CSS 字体设置（如 font-size: 1rem 或 1em），在 Chrome DevTools 的响应式预览中尺寸完全一致，但在真实 Android 手机（如 401ppi 的高密度屏）上，位于