css教程系列5：px、em、rem区别介绍

1 PX

px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。

PX特点

• 1. 浏览器无法调整px单位的字体，以em或rem为字体单位可调整字体。

 

2 EM

em是相对长度单位。

EM特点

• 1. em的值并不是固定的；

• 2. 行高：n倍的 em = n *父级元素的像素px大小（若无则*浏览器的默认字体）。

3 REM

rem是CSS3新增的一个相对单位（root em，根em），也是相对大小，相对的只是HTML根元素。

p {font-size:14px; font-size:.875rem;}

 

4 px 与 rem 的选择？

对于只需要适配少部分手机设备，且分辨率对页面影响不大的，使用px即可 。

对于需要适配各种移动设备，使用rem，例如只需要适配iPhone和iPad等分辨率差别比较挺大的设备。