通常最简单的设置rem的方法为:body {font-size:62.5%} 【1rem=10px】
但是这种方法在用于小于0.8rem字体的时候就会设置不了
所以最好的方法还是使用JS判定
//原生 (function () { var docEl = document.documentElement; var resize = 'orientationchange' in window ? 'orientationchange' : 'resize'; var setRem = function () { var screenWidth = docEl.clientWidth || window.screen.width || 360; // 750 PSD宽度(可变的) docEl.style.fontSize = (100 * screenWidth / 750) + 'px'; }; window.addEventListener('resize', setRem, false); setRem(); })();// 用法psd量出来的像素距离 除以100 比如psd: 100px 转换后 1rem; //JQ function resetFontSize(){ $('html').css('font-size', $('body').width()/7.5); } resetFontSize(); $(window).resize(function(){ resetFontSize(); })
欢迎分享本文,转载请保留出处:前端ABC » 针对移动端设置rem的问题