css中单位px和em,rem的区别

px

相对长度单位。像素（Pixel）。

像素是相对于显示器屏幕分辨率而言的。例如，WONDOWS的用户所使用的分辨率一般是96像素/英寸。而MAC的用户所使用的分辨率一般是72像素/英寸。(css手册3.0)

em

相对长度单位。相对于当前对象内文本的字体尺寸。

如当前行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。 (css手册3.0)

google的默认字体高是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。

rem

是css3新增的相对长度单位，相对于html根元素设置的文本尺寸单位。只需设置根元素尺寸，则内容所有字体可按比例调整大小。

对于需要适配各种移动设备，会使用rem长度单位,采用媒体查询方法获取分辨率设置html根元素大小。

/*移动端适配*/
@media screen and (min-width: 320px){
    html{
        font-size: 16px;
    }
}
@media screen and (min-width: 360px){
    html{
        font-size: 18px;
    }
}
@media screen and (min-width: 375px){
    html{
        font-size: 18.75px;
    }
}