用js实现在不同宽度的视口下自动调整字体大小
作者:互联网
<div>
Merry Christmas Eve
</div>
<script>
var autoFontSize=()=>{
let deviceWidth = document.documentElement.clientWidth;
let fontSizeVal = (20*(deviceWidth/320) > 40 ? 40 +"px" : (20*(deviceWidth/320) + "px"));
document.documentElement.style.fontSize = fontSizeVal;
}
window.addEventListener("load",autoFontSize)
window.addEventListener("resize",autoFontSize)
</script>
切记不要忘记加上下面内容:
<meta name="viewport" content="width=device-width,initial-scale=1.0;" />
标签:20,px,40,js,window,视口,deviceWidth,autoFontSize,字体大小 来源: https://blog.csdn.net/Kiruthika/article/details/111658459