- px：绝对单位，页面按精确像素展示
- em 单位转为像素值，取决于他们使用的字体大小。 此字体大小受从父元素继承过来的字体大小，除非显式重写与一个具体单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
- em单位会被显式重写大小决定， 父元素字体大小， 浏览器的默认字体大小。
<div style="font-size:20px;">
<p style="font-size:1em;">这里1em=20px</p>
<p style="font-size:2em;">这里2em=40px</p>
</div>
- rem是CSS3新增的一个相对单位（root em，根em），这个单位引起了广泛关注。这个单位与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。rem 单位翻译为像素值是由 html 元素的字体大小决定的。 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位。
<html style="font-size:100px;">
<head>
<title></title>
</head>
<body>
<p style="font-size:1rem;">这里1rem=100px</p>
<div style="font-size:50px;">
<p style="font-size:2rem;">这里2rem=200px</p>
</div>
</body>
</html>
- rem 单位翻译为像素值是由 html 元素的字体大小决定的。 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位。
- em单位转为像素值，取决于他们使用的字体大小。 此字体大小受从父元素继承过来的字体大小，除非显式重写与一个具体单位。