1.px

px其实就是像素的意思，全称pixel，也就是图像的基本采样单位。对于不同的设备，它的图像基本单位是不同的，比如显示器和打印机。总的来说px就是对应我们显示器的分辨率。这样就会有个问题就是如果使用px的话我们就要根据不同电脑的分辨率来做自适应，有点麻烦。

2、em

em是相对长度单位。相对于当前对象内本文的字体尺寸（如果没有设置本文尺寸，那就是相对于浏览器默认的字体尺寸，也就是16px），这样计算的话。如果没有设置字体尺寸就是1em = 16px。如果使用em的话，有个好的建议，就是将body的font-size设置成62.5%，也就是16px * 62.5% = 10px。这样的话1em = 10px，方便我们计算。

3、rem

rem和em一样也是相对长度单位，但是不一样的是rem始终都是相对html根元素。这样有个很大的优点就是使用rem后不会受到对象内文本字体尺寸的影响，而且只需要改变根元素就能改变所有的字体大小。

4、vw和vh

vw和vh是视口（viewport units）单位，浏览器窗口的大小的单位，不受显示器分辨率的影响。但是没有最小设置。

css3新单位，view width的简写，是指可视窗口的宽度。假如宽度是1800px的话。那10vw就是180px

举个例子：浏览器宽度1800px, 1 vw = 1800px/100 = 18 px。

5.%

一般来说就是相对于父元素的，对于普通定位元素就是我们理解的父元素，对于position: absolute;的元素是相对于已定位的父元素，对于position: fixed;的元素是相对于ViewPort（可视窗口）。

6.vm

css3新单位，相对于视口的宽度或高度中较小的那个。如：浏览器高度1000px，宽度1800px，取最小的浏览器高度，1 vm = 1000px/100 = 10px。

7.rpx

微信小程序开发中新出了尺寸单位rpx（responsive pixel）: 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。