美文网首页
rem适配问题

rem适配问题

作者: 小曼杂货铺 | 来源:发表于2017-01-06 17:46 被阅读0次
    (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);
    

    body{font-size:20px}
    说明:iphone4/5/5s(320px)下,1rem = 20px

    相关文章

      网友评论

          本文标题: rem适配问题

          本文链接:https://www.haomeiwen.com/subject/owcxbttx.html