rem、rm、px、vw之间的相互转换
💡
原文中文，约2700字，阅读约需7分钟。
📝
内容提要
px是屏幕显示的最小单位，移动端的1px与物理像素不同。rem和em是相对单位，基于根元素的字体大小。响应式布局可通过设置不同屏幕宽度的font-size实现，也可以使用vw和px进行单位转换。
🎯
关键要点
- px是屏幕显示的最小单位，移动端的1px与物理像素不同。
- rem是相对于html根元素的字体大小计算的长度单位，默认16px。
- em是相对单位，继承父级尺寸，所有现代浏览器下默认字体尺寸为16px。
- vw与px、rem之间的换算可以通过设定根元素的font-size实现。
- 响应式布局可以使用百分比与rem设置宽度和高度。
- 可以通过媒体查询设置不同屏幕宽度下的根元素font-size。
- 使用vw视口单位可以动态调整根元素的font-size。
- postcss-pxtorem插件可以将px转换为rem，方便移动端适配。
➡️
