JS控制网页文字大小,使其能够自适应屏幕大小
JS控制网页文字大小,使其能够自适应屏幕大小
设置根字体大小,使之自适应屏幕宽度:
(function(doc, win) { setRem(); var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function() { setRem(); }; if (!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); // doc.addEventListener('DOMContentLoaded', recalc, false); })(document, window); function setRem() { var docEl = document.documentElement; var clientWidth = docEl.clientWidth; if (!clientWidth) { return; } docEl.style.fontSize = 100 * (clientWidth / 1080) + 'px'; }
其他字体大小,以根字体大小计算可得(单位rem):
比如根字体 font-size=16px,那么我想设置12px 的文字就是:12÷16=0.75(rem)