尺寸单位

rem

先将1rem设为屏幕宽度的1/20：

document.addEventListener('DOMContentLoaded', function () {
  document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
})

假设设计稿的屏幕尺寸是375*675，一个尺寸值是100px，那么这个尺寸值用rem表示就是：

100/(375/20) = 100 * 20 / 375 = 5.33 (rem)

如果看不懂，看下面的伪代码：

const screen_width = 375
const rem = screen_width / 20  // 1rem等于多少px
const size_in_px = 100
const size_in_rem = size_in_px / rem

rpx

rpx时微信小程序解决自适应屏幕尺寸的尺寸单位。微信小程序规定屏幕的宽度为750rpx。

由于iphone6的屏幕宽度为375px，换算成750rpx就是1:2的关系，因此很多开发者经常会以iphone6来进行设计。