<!DOCTYPE html>
<html><head>
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimal-ui" /> <title>测试</title> <script src="js/jquery.min.js"></script> <script> var fun = function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function() { var clientWidth = docEl.clientWidth; if(!clientWidth) return;//这里是假设在640px宽度设计稿的情况下，1rem = 24px；
//可以根据实际需要修改 docEl.style.fontSize = 24 * (clientWidth / 750) + 'px'; }; if(!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); doc.addEventListener('DOMContentLoaded', recalc, false); } fun(document, window); </script> </head><body>
<div style="font-size: 1rem;background: red;height:1.5rem ;color: white;text-align: center;">测试</div> </body></html>