pc端上使用rem

最新推荐文章于 2023-06-12 20:57:23 发布

Agwenbi

最新推荐文章于 2023-06-12 20:57:23 发布

阅读量4.5k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/Ag_wenbi/article/details/86664684

版权

JavaScript 专栏收录该内容

47 篇文章 3 订阅

订阅专栏

function resize(){
    var w=document.body.clientWidth;
    document.querySelector("html").style.fontSize=w*20/1920+'px';
    //rem与px没有实际的关系，根据情况不同比例不同的，这里说的根据情况，实际上就是自己设定比例
  	//假设1rem=20px;那么关系就是(屏幕宽度*20/设计稿宽度)，设计稿的字体大小是16px，那么就等于16/20rem;
  	//假设1rem=16px;那么关系就是(屏幕宽度*16/设计稿宽度)，设计稿的字体大小是16px，那么就等于16/16rem;
  	//注意，谷歌浏览器最小字体为12px,定义关系的时候，不要小于12px;极限是1rem=12px；
};
document.body.onresize=resize;
resize();