本文详细介绍了vw、px、rem三种网页尺寸单位之间的转换关系，并提供了具体的计算示例。通过设置不同基准，展示了如何在100vw对应750px的情况下，将像素值转换为vw和rem值，适用于不同浏览器的适配和布局设计。
px是固定的大小单位
而vw是根据设备的大小来划分的单位
1vw=1%窗口宽度（也就是窗口宽度是100vw）
以固定宽度750px为例进行计算：
一、vw、px、rem换算（1rem = 100px）：（谷歌，火狐，IE、uc、qq浏览器适用）
已知：750px = 100vw
计算：1px = (100vw / 750px) = 0.1333vw
定义：1rem = 100px （也就是1px = 0.01rem）
那么：1rem = 0.1333vw * 100 = 13.33vw （设置：根标签html字体为100px：font-size = 13.33vw）
换算：1rem = 100px = 13.33vw
1px = 0.01rem = 0.1333vw
示例：16px = 0.01rem * 16 = 0.16rem
二、也可以这样换算（1rem = 1px）：（谷歌，火狐，IE适用，uc、qq浏览器不适用）
已知：750px = 100vw
计算：1px = (100vw / 750px) = 0.1333vw
定义：1rem = 1px （也就是1px = 1rem）
那么：1rem = 0.1333vw （设置：html的根元素设置为1px：font-size = 0.1333vw）
换算：1rem = 1px = 0.1333vw
1px = 1rem = 0.1333vw
示例：16px = 16rem
扫一扫
704
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
