css--px，em，rem、vw、vh

px，em，rem、vw、vh
1.px (pixel，像素)：
是一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是72dpi。
2.em(相对长度单位，相对于当前对象内文本的字体尺寸)：
是一个相对长度单位，最初是指字母M的宽度，故名em。现指的是字符宽度的倍数，用法类似百分比，如：0.8em, 1.2em,2em等。通常1em=16px。
3.rem(root em，根em):
rem是一个相对单位，1rem等于html元素上字体设置的大小。我们只要设置html上font-size的大小，就可以改变rem所代表的大小。这样我们就有了一个可控的统一参考系。我们现在有两个目标：rem单位所代表的尺寸大小和屏幕宽度成正比，也就是设置html元素的font-size和屏幕宽度成正比rem单位和px单位很容易进行换算，方便我们按照标注稿写cssrem与em的区别：rem是相对于根元素（html）的字体大小，而em是相对于其父元素的字体大小em最多取到小数点的后三位
4.vw、vh：
css3中引入了一个新的单位vw/vh，与视图窗口有关，vw表示相对于视图窗口的宽度，vh表示相对于视图窗口高度，除了vw和vh外，还有vmin和vmax两个相关的单位。各个单位具体的含义如下：
vw 相对于视窗的宽度，视窗宽度是100vw
vh 相对于视窗的高度，视窗高度是100vh
vmin vw和vh中的较小值
vmax vw和vh中的较大值
这里我们发现视窗宽高都是100vw／100vh，那么vw或者vh，下简称vw，很类似百分比单位。vw和%的区别为：
% 大部分相对于祖先元素，也有相对于自身的情况比如（border-radius、translate等)
vw/vh 相对于视窗的尺寸