text-size-adjust: 100% 仅锁定渲染比例，不解决字号过小、框架覆盖、内核不支持等问题；需配合 font-size 显式设置、viewport 配置及 JS 降级方案。
直接加 text-size-adjust: 100% 到 html 或目标容器上，但必须配合检查最终渲染字号、避免被框架覆盖、兼顾可访问性——单靠一行 CSS 很容易失效。
为什么 text-size-adjust: 100% 加了也没用
这个属性不是“开关”，而是“比例锁定”：它只确保浏览器按你写的字号 1:1 渲染，不干预用户手动缩放，也不修复本身字号过小的问题。常见失效场景：
- 写了
text-size-adjust: 100%，但font-size最终计算值是14px（比如根字号设成12px，再写1.166rem） - 样式被 Ant Design Mobile、Vant 等 UI 库的高优先级规则覆盖，没生效
- 只加在
body上，但目标文字在footer的子元素里，而该子元素继承了更小的font-size - Android 微信 X5 内核根本不识别这个属性，查
getComputedStyle(document.body).webkitTextSizeAdjust返回空字符串
input 和 textarea 聚焦时页面放大怎么压住
iOS Safari 的 Font Boosting 机制会强制缩放整个视口，前提是输入框渲染字号 < 16px。这不是样式错，是底层渲染逻辑。可靠解法是组合控制：
- 给
input, textarea, select显式声明font-size: 16px !important（必须用px或clamp()这类能保证下限的绝对单位） - 同时加
-webkit-text-size-adjust: 100%，封堵 Safari 的二次干预 - 确认
<meta name="viewport">存在且不含user-scalable=no—— 缺失或禁用缩放会导致该机制更激进 - 真机调试时，一定要看 Safari 开发者工具「Computed」面板里的
font-size值，不是源码里写的那行
安卓和微信里字体乱掉，CSS 还管不管用
CSS 层面基本失效。Android Chrome 和 Samsung Internet 触发的是文本区域级自动缩放（text size adjustment），但微信 X5 内核连 -webkit-text-size-adjust 都不解析。此时必须切 JS 方案：
立即学习“前端免费学习笔记（深入）”；
- 在
<head>尽早执行：WeixinJSBridge?.invoke('setFontSizeCallback', {fontSize: 0}) - 监听
menu:setfont事件，防止用户点菜单后重置 - 对华为 EMUI 等定制系统，fallback 检测
window.matchMedia('(min-resolution: 2dppx)')并动态重设html的font-size - 别等
DOMContentLoaded，否则页面已错乱才修正，用户看到闪动
真正难处理的从来不是加哪行 CSS，而是字号在继承链、rem 计算、框架注入、内核差异之间不断“漏出”临界值——每次改完记得连真机开「Computed」面板盯一眼 font-size 像素值，比猜配置快十倍。
