在寻找三者的区别之前，我们需要先了解css的长度单位有哪些：
有两种类型的长度单位：相对和绝对。
相对长度
相对长度单位指定了一个长度相对于另一个长度的属性。对于不同的设备相对长度更适用。
图1.1
绝对长度
绝对长度单位是一个固定的值，它反应一个真实的物理尺寸。绝对长度单位视输出介质而定，不依赖于环境（显示器、分辨率、操作系统等）。
图1.2
像素或许被认为是最好的"设备像素"，而这种像素长度和你在显示器上看到的文字屏幕像素无关。px实际上是一个按角度度量的单位。
总结可得：
1、px是绝对长度单位；
2、em和rem是相对长度单位；
3、em相对的是父元素的font-size，而rem相对于根元素html的font-size；
其中，em的缺点：
1）em的值并不是固定的；
2）em会继承父级元素的字体大小（参考物是父元素的font-size；）；
3）em中所有的字体都是相对于父元素的大小决定的；所以如果一个设置了font-size:1.2em的元素在另一个设置了font-size:1.2em的元素里，而这个元素又在另一个设置了font-size:1.2em的元素里，那么最后计算的结果是1.2X1.2X1.2=1.728em
还有，rem的优点：
1）rem单位可谓集相对大小和绝对大小的优点于一身
2）和em不同的是rem总是相对于根元素(如:root{})，而不像em一样使用级联的方式来计算尺寸。这种相对单位使用起来更简单。
3）rem支持IE9及以上，意思是相对于根元素html（网页），不会像em那样，依赖于父元素的字体大小，而造成混乱。使用起来安全了很多。
表格：单位的兼容
图1.3
注意: Internet Explorer 9 通过不标准的名称 vm 来支持 vmin 。
