px em rem

PX特点

1. IE无法调整那些使用px作为单位的字体大小；

2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；

3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。

px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)

EM特点 

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

2. em会继承父级元素的字体大小。

       任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。

如果网站上要用em作为单位，这个值的计算是相对低级字体大小来计算的，如果父级没有设置大小，那就是根据body根的字体大小来设置，这个时候一定要在body里设置一个固定字体大小一定要设置字体大小

1》如果设置px那以后设置em字体就是根据父级相对设置公式（设置对象字体大小/父级字体大小）----如果父级字体号没有设置那就用body里的字体大小

例如 body{font-size:62.5%;fong-size:14px;}

   

如果div设置的字体大小是1.4em;那p想设置16号字体  （1.6em/1.4em=1.14em）

2》如果div没有设置字体大小，那p想设置16号字体的时候，那就要看使用body里的字体大小来设置公式和以上的一样的设置方法

rem特点 

rem是CSS3新增的一个相对单位（root em，根em），这个单位引起了广泛关注。这个单位与em有什么区别呢？区别在于使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。目前，除了IE8及更早版本外，所有浏览器均已支持rem。对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。下面就是

html{font-size:62.5% }

如果开发请先考虑好用哪个字体单位，尽量不要把em和rem的单位混着使用，计算起来太复杂麻烦，容易出现问题

em和rem在总体的要目录设置的地方不一样

em里是定在body里的

rem是定在html里的

（注，这个是我自己测试得的结果，只供参考自己记录，如果有问题或更好的解决办法欢迎交流）