有关px，em，rem的区别

px，em，rem都是描述屏幕上大小的单位。

 

px，是指屏幕上的像素单位，不同尺寸的屏幕上，1px的大小不同。

em，则是相对而言的单位。现代浏览器默认字体为16px，则1em=16px，那么设置某字体大小为0.8em，则0.8em=16px * 0.8=12.8px；所以em的值并不固定，且em具有继承性，能够继承父元素的大小。例如：

<div>
    <p></p>
</div>

声明div中的字体为0.5em，默认16px情况下div中内容为8px，那么此时P标签的font-size，它的1em=8px，而不再是16px。

那么问题就来了，在多层嵌套下，em的相对计算就会变得很麻烦。为了解决这样的问题，rem诞生了。

 

rem，(root em)从名字可以开出来，说白了还是em，只不过是相对于根元素html的而言的单位。这就没有了em的那些复杂的继承问题。除了老版本的浏览器外，各大浏览器的最新版本基本都已经支持rem了，对于无法支持的旧版浏览器，也只需要多写个px上去就好了，例如：

p {font-size:16px;font-size:1rem;}