自适应的写法之一

首先设置body内字体大小为:font-size:0.6rem;
然后写一个js,内容如下,在样式中控制大小均为rem即可:
!function(e,t){function i(){var t=n.getBoundingClientRect().width;t/m>640&&(t=640m);var i=t/16;n.style.fontSize=i+“px”,d.rem=e.rem=i}var a,r=e.document,n=r.documentElement,o=r.querySelector(‘meta[name=“viewport”]’),l=r.querySelector(‘meta[name=“flexible”]’),m=0,s=0,d=t.flexible||(t.flexible={});if(o){console.warn(“将根据已有的meta标签来设置缩放比例”);var p=o.getAttribute(“content”).match(/initial-scale=([\d.]+)/);p&&(s=parseFloat(p[1]),m=parseInt(1/s))}else if(l){var c=l.getAttribute(“content”);if©{var u=c.match(/initial-dpr=([\d.]+)/),f=c.match(/maximum-dpr=([\d.]+)/);u&&(m=parseFloat(u[1]),s=parseFloat((1/m).toFixed(2))),f&&(m=parseFloat(f[1]),s=parseFloat((1/m).toFixed(2)))}}if(!m&&!s){var v=(e.navigator.appVersion.match(/android/gi),e.navigator.appVersion.match(/iphone/gi)),h=e.devicePixelRatio;m=v?h>=3&&(!m||m>=3)?3:h>=2&&(!m||m>=2)?2:1:1,s=1/m}if(n.setAttribute(“data-dpr”,m),!o)if(o=r.createElement_x(“meta”),o.setAttribute(“name”,“viewport”),o.setAttribute(“content”,“initial-scale=”+s+", maximum-scale="+s+", minimum-scale="+s+", user-scalable=no"),n.firstElementChild)n.firstElementChild.appendChild(o);else{var x=r.createElement_x(“div”);x.appendChild(o),r.write(x.innerHTML)}e.addEventListener(“resize”,function(){clearTimeout(a),a=setTimeout(i,300)},!1),e.addEventListener(“pageshow”,function(e){e.persisted&&(clearTimeout(a),a=setTimeout(i,300))},!1),“complete”===r.readyState?r.body.style.fontSize=12m+“px”:r.addEventListener(“DOMContentLoaded”,function(){r.body.style.fontSize=12*m+“px”},!1),i(),d.dpr=e.dpr=m,d.refreshRem=i,d.rem2px=function(e){var t=parseFloat(e)*this.rem;return"string"==typeof e&&e.match(/remKaTeX parse error: Expected 'EOF', got '&' at position 3: /)&̲&(t+="px"),t},d…/)&&(t+=“rem”),t}}(window,window.lib||(window.lib={}));

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值