手机端wap网站使用rem字体自适应方法,随屏幕大小缩放自适应大小文字
只需要在做的时候引入这个js代码,pc端使用的px代码可以转化成rem;比如240px,在手机端是2.4rem.
(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var deviceWidth = docEl.clientWidth; if (!deviceWidth) return; if(deviceWidth > 750) deviceWidth = 750; docEl.style.fontSize = deviceWidth / 7.5 + 'px'; }; if (!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); doc.addEventListener('DOMContentLoaded', recalc, false); })(document, window);
介绍一个px直接转化成rem的网站:http://www.ofmonkey.com/front/rem ;可以直接复制你在的样式过去转化.如果你有其他更好的方法也可以提出来喔~欢迎打扰
本文作者: Jasmine
本文链接: https://www.jianbaizhan.com/article/593
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!