在head标签上加入:
(function() { var b = navigator.userAgent; ipad = b.match(/(iPad).*OSs([d_]+)/) ? true : false; iphone = !ipad && b.match(/(iPhonesOS)s([d_]+)/) ? true : false; uc = navigator.userAgent.indexOf("UCBrowser") > -1 ? true : false; ios = ipad || iphone; var d = 1,a = 1,c; if (ios) { if (window.devicePixelRatio >= 2) { d *= 0.5; a *= 2 } } else { if (uc) { if (window.devicePixelRatio >= 2) { d *= 0.5; a *= 2 } } } c = '<meta name="viewport" content="initial-scale=' + d + ", maximum-scale=" + d + ", minimum-scale=" + d + ', width=device-width, user-scalable=no" />'; document.write(c); document.documentElement.style.fontSize = 20 * a + "px" })();
那么html上会根据手机的不同设置不同的font-size值,比如:<html style="font-size:20">,那么1rem=20px