225 字
1 分钟
部分浏览器rem自适应布局无故放大
自行写的项目打算兼容手机端，于是了解了下rem并投入使用。而当时看了别人的文章是把根元素 font-size 设置为了 62.5%，即 1rem=10px。
当时的我：为什么要等于 10px，我直接 1rem = 1px ，一个font-size: 6.25% 就拍了上去。
一开始写着没问题，待发布给别人预览的时候，悲剧了
经验证，1+ 和 qq 自带浏览器、夸克、uc 浏览器会出以上问题
原因
问题浏览器中，根节点元素的字体大小不能小于 10px，若小于，则按照 10px 处理。因此由于我上面设置了 font-size: 6.25% 即根元素 html 字号为 1px，导致整个页面被放大了 10 倍
解决方法
老老实实把根节点字号设置为不小于 62.5%，再将所有元素宽度统一掉 10，问题解决
分享
如果这篇文章对你有帮助，欢迎分享给更多人！
部分浏览器rem自适应布局无故放大
https://marrydream.top/posts/web前端/部分浏览器rem自适应布局无故放大/ 部分信息可能已经过时
相关文章 智能推荐