以设计稿的宽度为750px(iphone6屏幕尺寸 的2两倍),即:designWidth = 750,同时设定在750px屏宽下 1rem=100px ,即:rem2px = 100。
设置 1rem=100px 的优点不言而喻。前端开发者在切图、重构页面的时候,通过直接位移小数点的方式,就可以将UI图中测量到的 px 值换算成对应的 rem 值,方便快捷。
此外,在 head 中我们还设置了:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" />
以下方法存在一些误差
document.documentElement.style.fontSize =
((window.innerWidth / designWidth) * rem2px) + 'px';
更多详细参考rem手机适配