Mobile REM settings, auto-change html<font-size>

<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 = * (clientwidth/320) + ' px ';            };            if (!doc.addeventlistener) return;            Win.addeventlistener (Resizeevt, Recalc, false);            Doc.addeventlistener (' domcontentloaded ', Recalc, false);            }) (document, window);     </script>

　　

Add such a section of JS, you can dynamically change the width of the screen according to the Font-size

According to this sentence docEl.style.fontSize = (clientwidth/320) + ' px '; Know

iphone4 width is 320px, then Font-size is 20px, 100px is 5rem

Iphone6 width is 375px, then Font-size is 23.4375px,100px is 4.267rem

Package for red Rice mobile phone Xiaomi. Use media to query @media a bit of a pit. Some do not support so force the HTML to change the root dynamically according to the width of the screen by a section of JS

Mobile REM settings, auto-change html<font-size>