前端单位的理解

• px、%、em：兼容性更好；需要适配更多屏幕，css3新增rem、vw、vh、vm等，可以更好具有响应式的页面，一套代码覆盖更多设备（手机、平板、电脑等）；
• px：固定大小，用于屏幕媒体（在设备屏幕上读取），一个像素等于设备屏幕上的一个点（分辨率最小的单位），绝对长度单位，不会根据屏幕大小做改变；
• %：相对长度单位，相对于包含块（静态和相对定位，包含块指它的父元素；绝对定位，指离他最近的非静态定位的祖先元素；固定定位，包含块指视口）的宽度或字体大小；
• em：相对于字体长度单位，用于font-size本身，则是相对于父元素的font-size；不固定的，会继承父元素字体大小；
• rem：css3新增，相对于根元素（默认16px）的字体大小，为了方便计算，需在html中声明font-size=62.5%，这样rem就是10px；
• vw和wh：css3新增，指视口宽度和视口高度；1vh = 1%视口高度，1vw = 1%视口宽度；
• vm：wmin：取当前vh和vw的最小值（可视区大小720 *680，1wmin = 680/100 = 6.8px）和vmax：当前vh和vw的最大值（可视区大小为1920 *1080，1vmax = 1920px/100 = 19.2px）；