css rem em px

rem em px的区别

1.px:像素（pixel）相对长度单位，像素px是相对于显示器屏幕分辨率而言的

• IE无法调整那些使用px作为单位的字体大小
• 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；
• Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)

2.em：相对长度单位：相对当前对象内文本的字体尺寸，任意浏览器的默认字体高都是16px，所以未经调整的浏览器都符合: 1em=16px。

• em值并不是固定的 ，会继承父级元素字体的大小

<div style="font-size:20px;">
    <p style="font-size:1em;">这里1em=20px</p>
    <p style="font-size:2em;">这里2em=40px</p>
</div>
//上面的例子就说明了em的值并非固定的，他是根据父元素的字体大小来决定的。如果父元素设置了font-size:20px，那么1em=20px，2em=40px；如果父元素设置了font-size:30px，那么1em=30px，2em=60px。依次类推。

3.rem:是CSS3新增的一个相对单位，可以理解为"root em"，相对于根元素html的字体大小来计算的，chrome/firefox/IE9+支持。任意浏览器的默认字体高都是16px，所以未经调整的浏览器都符合: 1rem=16px。