css rem px换算

CSS中的单位有很多种，其中的px是我们最常用的单位之一，但是用px作为大小的单位有一个缺点，就是在不同的屏幕上显示的大小不同。这就是因为不同的屏幕分辨率不一样造成的。因此，我们需要一种更为灵活的单位来规定网页上的元素大小，rem就是这样一种单位。

rem是相对于根元素（即HTML元素）的字体大小来计算的。因此，只要在根元素上设置一个字体大小，其他元素都可以相对于这个字体大小来设置自身的大小。

为了方便计算，我们一般会将rem单位转换成px单位。具体转换方法为：在CSS中设置html元素的字体大小为16px（这个值可根据实际情况自行调整），之后就可以在其他元素中使用rem单位，按照比例转换成px。

/*设置html字体大小为16px*/
html {
  font-size: 16px;
}

/*使用rem单位设置字体大小为24px*/
p {
  font-size: 1.5rem; /*1.5 x 16 = 24*/
}

上述CSS代码中，p元素的字体大小为1.5rem，实际上是16乘以1.5得到24。这样便实现了使用rem单位灵活地规定网页上的元素大小。