移动端 rem js

个人觉得写移动端的页面的时候rem和position搭配使用很好 , 我是按照750的尺寸来写的   所有1rem=100px   字体12*100=.12rem   clientWidth / 375  是6的分辨率  大家可以在谷歌F12  看到

(function() {
        var docEl = document.documentElement,
                resizeEvt = 'onorientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function() {
                        var clientWidth = docEl.clientWidth;
                        if(!clientWidth) return;
                        if(clientWidth >= 600) {
                                docEl.style.fontSize = '100px';
                        } else {
                                docEl.style.fontSize = 100 * (clientWidth / 375) + 'px';
                        }
                };
        window.addEventListener(resizeEvt, recalc, false);
        document.addEventListener('DOMContentLoaded', recalc, false);
})();

欢迎分享本文,转载请保留出处:前端ABC » 移动端 rem js

赞 (3)
分享到:更多 ()

发表评论 0