移動端rem設置，自動更改html

<script>        
        (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);    
 </script>

　　

加入這么一段js，就可以根據屏幕的寬度動態改變font-size

根據這一句 docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  可知

iphone4寬度是320px，那么font-size就是20px, 100px就是5rem

iphone6寬度是375px，那么font-size就是23.4375px,100px就是4.267rem

 包治紅米手機 小米手機。  用媒體查詢 @media有點坑。 有的不支持所以強制通過一段js根據屏幕的寬度動態改變根的html