js计算rem的问题
rem是相对于根元素<html>，下面是js计算rem布局的方式
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);})(document, window);
这段代码的
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
我想知道怎么把设计图的量出来的px尺寸转为相应rem的值，不太明白 有人吗
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
以上代码针对 750的设计稿
640的设计稿，上面750改成640 7.5改成6.4
设计稿换算rem
100px=1rem
50px=.5rem
使用postcss-pxtorem插件 配置好比例 自动转化 量设计图 写px就好
按照你说的150/20 =7.5rem,上面320改成375
那么UI图上量出来的是750 那么我750/2=37.5rem
那么在浏览器上测试时候 320 640 750屏幕上显示的分别是是642px 1282 1502 感觉很奇怪
rem是基于根结点的font-size的px值来算的，然后这里clientWidth一般是320 375 1080等，这样fontSize就是不一样了