手机横过来正文字忽然变大 text-size-adjust 没锁住

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

手机横过来后正文字突然大了一号，行距跟着变，竖屏下又恢复原样，看起来像浏览器自己动了字号。先别急着动参数，把报错原文和时间点记下来，顺序反了容易白折腾。

原因不复杂，移动浏览器在横屏或宽屏下会做文字自动放大，没写 text-size-adjust 时按自己的规则算，和设计稿完全对不上。这类放大只影响文字，写完在真机上横竖各看一次。

围绕「text-size-adjust」排查时，命令行跑一遍比在面板里点十次有用，面板会替你做掉不少隐式操作。改动写完就同步给同事，下一个人踩同一个坑，成本还是你的。

处理上按这个顺序：在 html 根元素上加 text-size-adjust，值写百分之百，把自动放大关掉，这行只影响文字；同时保留 -webkit- 前缀，iOS 上认的是带前缀那一条，两条都要写全；字号统一用 rem，不要混着 px 和百分比，混用后更难追，断点再改也不怕。

改完只确认一件事：横竖屏切换后正文字号一致，行数和断行位置都不变，两次结果要一致。