用js兼容各种大小浏览器屏幕

用js兼容各种大小浏览器屏幕

 (function(win,doc){
    var docEl = doc.documentElement;
    var change = 'orientationchange' in window? 'orientationchange' : 'resize';
    function sizeChange(){
        var cleantWidth = docEl.clientWidth;
        if(!cleantWidth) return;
        docEl.style.fontSize = 100*cleantWidth/640+'px';
    }
    win.addEventListener(change,sizeChange,false)
    doc.addEventListener('DOMContentLoaded',sizeChange,false)

})(window,document)


 可以兼容各种屏幕的字体,再也不要写媒体查询了.

 你的设计稿是多宽的,你就除以多少就行了.

 现在我的设计稿是640的宽 ,  rem= 100px