js移动端字号设置

本文主要是介绍js移动端字号设置，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

方式一： 

   <script>fixRem();window.addEventListener("resize", function(){fixRem();});function fixRem() {var windowWidth = window.innderWidth || document.documentElement.clientWidth || document.body.clientWidth;windowWidth = windowWidth < 320 ? 320 : windowWidth;windowWidth = windowWidth > 750 ? 750 : windowWidth;var rootSize = 20 * (windowWidth / 375);var htmlNode = document.getElementsByTagName("html")[0];htmlNode.style.fontSize = rootSize + 'px';}</script>

设计稿宽度：750px；

px计算rem：px/40 = rem

 

方式二：

<script>(function(){let html = document.documentElement;let hWidth = html.getBoundingClientRect().width;html.style.fontSize = hWidth / 15 + 'px';})()
</script>

‘hWidth / 15’中的15可以理解为将屏幕横向平分16份

即：如果设计稿宽度为750px，则： 1rem  = 50px

其中  

(function(){})()

表示立即执行函数

这篇关于js移动端字号设置的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---