rem，px，vw，em单位释义

1、rem，相对字体单位，相对HTMML的字体尺寸；

2、px，最常见的单位，屏幕的物理像素显示的点，通常一个物理像素点，他是根据屏幕大小去判定的呀，有时候屏幕大了会代表2个像素点；

3、vw，视口宽度，也就是，也就是，1vw=1%*视图宽度。也就是说，一个视图100vw，白话就是100份中的一份；

4、em，现在通常现在的浏览器，默认字体尺寸都是16px，1em =16 px 。em 会继承父级的尺寸，相对于他的父级的。

区分转换

1、我们假设pc的设计稿是以1920px为标准的。那么：

100vw = 1920px

1vw = 19.2px

我们想要：1rem = 100px (这样方便我们在写代码的时候换算)

那么：

100px = 100vw / 19.2 = 1rem

所以:

1rem = 5.208vw

这时候，我们只要给html的根元素设置：

font-size: 5.208vw 即可。

2、同理的，手机端我们假设设计稿是以750px为标准的，那么

100vw = 750px

1vw = 7.5px

我们想要：1rem = 100px

那么：

100px = 100vw / 7.5 = 1rem

那么：

1rem = 13.33vw

同理：我们想要： 1rem = 10px

1rem = 1.33vw

font-size = 1.33vw

转载地址：https://blog.csdn.net/weixin_44828486/article/details/121036608