本文介绍了html5响应式开发自动计算fontSize的方法，分享给大家，具体如下：

var winWidth = window.innerWidth;  
var winHeight = window.innerHeight; 
//获得屏幕的宽度   rem=屏幕宽度/7.5+"px"
var perRemPx = document.getElementsByTagName("html")\[0\].clientWidth / 7.5;  
  //动态计算
window.addEventListener("resize", function () {  
//获得屏幕的宽度   rem=屏幕宽度/7.5+"px"
    perRemPx = document.getElementsByTagName("html")\[0\].clientWidth / 7.5;  
     //将得到的rem值复制给根元素的font-size
  document.getElementsByTagName("html")\[0\].style.fontSize \= perRemPx + "px";  
});  
//  将得到的rem值复制给根元素的font-size
document.getElementsByTagName("html")\[0\].style.fontSize \= perRemPx + "px";

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• flex弹性盒布局怎样实现元素左对齐的效果？

  这篇文章给大家分享的是关于flex弹性盒布局的内容，下文实现的效果是元素左对齐，也就是八张图的九宫格，最后一行要实现左对齐的效果，那么具体怎样做呢？下面我们详细的了解看看。

• CSS3动画卡顿是什么原因，怎样解决

  今天主要介绍一下CSS3 动画卡顿解决方案，原因就是主线程和合成线程的调度不合理。本文详解的介绍了解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

• CSS简写属性会覆盖其他样式吗，简写值的顺序是什么

  简写属性是用于同时给多个属性赋值的属性。比如font是一个简写属性，可以用于设置多种字体属性。它指定了font-style、font-weight、font-size、font-height以及font-family。

• 深入理解CSS3中变换模型渲染，有哪些知识点

  相信很多小伙伴们对于CSS3中transform变换模型的渲染都是非常感兴趣的，下文的讲解详细，步骤过程清晰，对大家进一步学习和理解相关知识有一定的帮助。有这方面学习需要的朋友就继续往下看吧！

• CSS隐藏元素有几种方法，特点分别是什么

  CSS隐藏元素有几种方法，特点分别是什么？一些朋友可能会遇到这方面的问题，对此在下文小编向大家来讲解一下，内容详细，易于理解，希望大家阅读完这篇能有收获哦，有需要的朋友就往下看吧！