应统一用 rem 配合动态设置 document.documentelement.style.fontsize 控制全局文字，避免直接改 body 或标签 font-size；vue/react 需适配 ssr 和 resize 节流；组件库优先用主题 token；须兼容系统缩放与 dpr。
用 rem 配合根元素字体大小统一控制全局文字
直接改 或每个标签的 font-size 会失控，尤其在响应式或框架（如 Vue/React 项目）中。主流做法是把所有文字单位设为 rem，再动态调 document.documentElement.style.fontSize。
常见错误：只设了 html { font-size: 16px } 却没配合 JS 动态适配，导致在 iPad 或高 DPR 屏上文字过小；或在移动端误用 em 导致嵌套放大。
- Vue 项目可在
main.js或app.vue的mounted中执行一次初始化：document.documentElement.style.fontSize = window.innerWidth / 375 * 16 + 'px';
（以 375px 设计稿为基准）
- React 项目建议封装成自定义 Hook，监听
resize并节流，避免频繁重排 - Next.js / Nuxt 等 SSR 框架需注意：服务端无
window，必须加if (typeof window !== 'undefined')守卫
框架内别硬写 style="font-size: 14px" —— 优先走主题变量或 CSS-in-JS 配置
像 Ant Design、Element Plus、Chakra UI 这类组件库，文字大小由主题系统统一管理。手动内联样式不仅覆盖困难，还会在暗色模式、缩放切换时失效。
典型问题：开发者发现按钮文字太小，就给 <button></button> 加 style，结果表格里的同名按钮没变，排查半天才发现是组件内部用了 token.fontSizeSM。
