px,em,rem的区别

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

px的特点：

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

2.em:em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

em特点

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

任意浏览器的默认高都是16px,也就是说1em=16px是默认的，在写css的时候要注意：

• 1.在body选择器中声明 Font-size=62.5%,这时候16px*62.5%=10px,所以1em = 10px,也就是说在原来px设置的基础上差异10就是现在的em表达数值了。
• 2.em会继承父级的字体大小，也就是给父级元素设置了1.2rem,再给子元素设置1.2rem,这时候子元素的字体大小不是1.2rem,而是1.44rem了，所以这时候我们要重新计算那些被放大的em 的数值，避免字体大小的重复声明

3.rem:rem是CSS3新增的一个相对单位（root em，根em）,rem在设置字体大小时，仍然是相对大小，相对的是html根元素，有点是可以做到修改根元素就可以成比例地调整字体大小，由可以避免字体大小的重复声明。目前，除了IE8之前的浏览器之外，所有浏览器均已支持rem.对于不支持的浏览器，多写一个绝对单位的声明即可，也就是写死px,p{font-size:16px;font-size:0.875rem}

建议：

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

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

用户群主要是最新版浏览器，推荐使用rem，考虑兼容性就两个都写。