它们都是用于设置字体的大小以及盒子的宽高，但是px不会因为浏览器尺寸的改变而改变，而em和rem会因为浏览器尺寸的变化而变化
① px（像素，相对于显示器屏幕分辨率而言）
② em（相对当前元素内文本的字体尺寸，会继承父元素大小）
③ rem （相对HTML根元素，最常用的单位）
1.PX
px 是 pixel 的缩写，它的含义是像素的意思，在指定字体大小和元素的宽高的时候使用。像素是相对于显示器屏幕分辨率而言的(它是绝对单位)
2.em
em是相对长度单位。先相对于当前标签内font-size的大小而言。
如果当前标签字体尺寸未被人为设置，当前标签内font-size的大小会相对父标签的字体大小。
【如果父标签也没设置大小，那么就会找到继承的顶点-->浏览器的默认16px字体大小。所以，默认情况16px==1em 】
我们还可以直接给body设置一个值，使其的值是直接相对于body的值，然后再将原来的px值除以10就是em的值了
从上面图中可以看出em的值并不是固定的而且是先相对于他的自身元素大小,如果自身没有设置大小,则相对与父级元素大小
3.rem
Rem是CSS3新增的一个相对单位（root em，根em）
rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素, 它的使用非常简单通过改变根元素的大小就可以改变它的值
