css - 使用rem布局的问题
问题描述
是这样的,看到网上有说可以动态定义根元素的font-size,我使用了document.documentElement.clientWidth/10来定义的,设计稿的宽度是750,按理来说在iphone6上的font-size要为75的,可是,我的却是37.5,然后就很迷茫了
问题解答
回答1:;(function (doc, win, undefined) {
var docEl = doc.documentElement,resizeEvt = ’orientationchange’ in win? ’orientationchange’ : ’resize’,recalc = function () { var clientWidth = docEl.clientWidth; if (clientWidth === undefined) return; docEl.style.fontSize = 20 * (clientWidth / 320) + ’px’;};if (doc.addEventListener === undefined) return;win.addEventListener(resizeEvt, recalc, false);doc.addEventListener(’DOMContentLoaded’, recalc, false)
})(document, window);
回答2:iphone的devicePixelRatio的为2,所以你需要设置<meta name='viewport' content='initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no'>
相关文章: