1. px (pixel，像素)：
px即pixel(像素)，是相对长度单位，根据屏幕的像素决定，最能准确还原设计图。px是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是72dpi。
2. pt (point，磅)：
pt 是印刷行业常用单位，是一个物理长度单位，指的是72分之一英寸。pt (point，磅)：是一个物理长度单位，指的是72分之一英寸。
3. em
em：相对单位(相对于当前对象内文本的字体尺寸)，相对父元素属性的单位，一般用于移动端布局，每个子元素透过「倍数」乘以父元素的px值。最初是指字母M的宽度，故名em。现指的是字符宽度的倍数，用法类似百分比，如：0.8em, 1.2em,2em等。通常1em=16px。
相对于当前对象内文本的字体尺寸，如当前对行内文本的字体尺寸未被认为设置，则相对于浏览器的默认字体尺寸。
但em值并不固定，它会继承父级元素的字体大小。
EM特点
1. em的值并不是固定的；
2. em会继承父级元素的字体大小。
4. rem
rem：是CSS3新增的一个相对单位，每个元素透过「倍数」乘以根元素的px值。结合相对定位和绝对定位的优势，相对根元素html，想要修改字体大小，只要修改html的大小就可以了
1em=16px。那么12px=0.75em,10px=0.625em。
rem兼容性
目前，除了IE8及更早版本外，所有浏览器均已支持rem。对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。下面就是一个例子：
p {font-size:14px; font-size:.875rem;}
注意： 选择使用什么字体单位主要由你的项目来决定，如果你的用户群都使用最新版的浏览器，那推荐使用rem，如果要考虑兼容性，那就使用px,或者两者同时使用。
对于只需要适配少部分手机设备，且分辨率对页面影响不大的，使用px即可 。
对于需要适配各种移动设备，使用rem，例如只需要适配iPhone和iPad等分辨率差别比较挺大的设备。
rem （root em）
与em的区别在于，它是相对于html根元素的。(在body标签里面设置字体大小不起作用)
既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应
rem 单位翻译为像素值是由 html 元素的字体大小决定的。 此字体大小会被浏览器中字体大小的设置影响，除非显式重写一个具体单位。
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作为单位就行了。”
来源：https://blog.csdn.net/lishuai_it_trip/article/details/98955348