viewport meta 标签必须写全且正确，否则 rem 失效；核心是 width=device-width 和 initial-scale=1.0，需避免固定宽度、动态覆盖及执行时机错误，并配合 box-sizing: border-box 和合理根字号设置。
viewport meta 标签必须写全，否则 rem 全部失效
不加或写错 <meta name="viewport">，rem 就是空中楼阁。浏览器默认用 980px 布局视口渲染，所有基于视口的计算（包括 rem 的根字号）都跑偏。
常见错误现象：页面整体被压缩、文字小得看不清、横向滚动条意外出现、点击区域错位。
-
width=device-width是核心，它让布局视口宽度 = 设备 CSS 像素宽度 -
initial-scale=1.0防止首次加载时缩放导致字体突变 -
maximum-scale=1.0, user-scalable=no必须带上——iOS 双击放大后视口缩放值变化，但html字号不变，rem 元素就集体“失重” - 别写
width=375这种固定值，它在非 375px 宽设备上强制缩放，rem 失去意义 - 不能用 JS 动态覆盖这行 meta，除非你明确知道在改什么
根字号设置必须同步执行，避免首屏闪动
很多项目用 JS 动态设 document.documentElement.style.fontSize，但线上出问题往往不是算法错，而是执行时机不对。
典型错误：JS 放在
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
