必须写全viewport属性，旧安卓机因缺失initial-scale=1.0会默认放大或按980px渲染，导致文字模糊、按钮失灵、横向滚动；正确写法为width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no。
viewport 必须写全，不能只写 width=device-width
很多旧安卓机（尤其是 android 4.4–6.0 的 Tecno、HTC、酷派、中兴低端款）会把没带 initial-scale=1.0 的 viewport 当作“未声明缩放”，默认放大 1.2 倍或强制按 980px 渲染，结果页面文字糊、按钮点不中、横向滚动条突兀出现。
- ✅ 正确写法：
- ⚠️ HTC / Acer / 朵唯等机型还可能需要动态加
target-densitydpi=device-dpi（仅限 UA 含Android 4.[1-4]时），否则宽度解析偏差达 25%；但 Android 5.0+ 加了反而触发兼容模式，字体变小 - ❌ 别信
width=320：Infinix NOTE 30 是 393px，朵唯 V5 是 360px，硬设 320 必然留白或缩放失真
别直接用 IntersectionObserver 或 ResizeObserver
Tecno、中兴 Blade 系列、酷派老机型普遍用 Android 8–10 + 未更新系统 webview（chrome/69 或更低），这些 API 根本不存在，调用即报 undefined 错误，且无降级提示。
- ✅ 替代方案：用
getBoundingClientRect()手动轮询判断元素是否进入视口（节流到 100ms 即可） - ✅
ResizeObserver降级：监听orientationchange+ 节流resize（注意 HTC 旧机resize触发极慢甚至不触发，优先用orientationchange） - ⚠️ 判断依据看 UA：真机访问时执行
console.log(navigator.userAgent)，若含WebView/69、Chrome/74或无明确 Chrome 版本号，基本可判定不支持
touch 事件必须同时绑 touchstart 和 click
HTC One M8、酷派大神 F2、Tecno spark 系列等机型的 WebView 默认启用 300ms 点击延迟，只绑 click 就是“点两下才响应”；但只绑 touchstart 又在桌面调试或某些定制浏览器里失效。
- ✅ 推荐组合：
touchstart中调e.preventDefault()消除延迟，再统一调处理函数；click作为兜底（保留给不支持 touch 的环境） - ✅ css 补一句：
touch-action: manipulation，Infinix、中兴新机型靠它就能免掉 js 防抖 - ❌ 避免用
fastclick：库体积小但逻辑复杂，酷派部分机型会误判 UA 为桌面端而静默跳过初始化
rem 基准必须用 JS 动态算，不能写死 font-size: 100px
HTC Sense ui、Tecno Hios、朵唯定制 ROM 会劫持 document.documentElement.style.fontSize，按系统字号设置强制放大，导致 rem 布局整体错位——你设 1rem = 16px，实际渲染可能是 22px。
立即学习“前端免费学习笔记（深入）”；
- ✅ 安全写法：在