px、rem、em、%等长度单位你一定不陌生。前者是绝对单位，后者是相对单位。CSS3引入了新的单位：vw、vh、vmin、vmax。让我们对它们进行详细的介绍。单位功能特点：px页面以精确像素显示。绝对单位rem是相对于根节点html字体大小计算的。相对单位em参考点是相对于父节点字体大小的。1vw表示窗口宽度的1%，窗口单位vh是窗口高度的百分比，1vh表示窗口高度的1%，窗口单位vmin是当前vw和vh中较小的一个，窗口单位vmax是当前vw和vh取值较大的窗口单位提示：vw、vh、vmin、vmax是一种窗口单位，也是一种相对单位。它与页面的父节点或根节点无关。由Viewport的大小决定，单位为1，相当于1%。视口是浏览器中实际显示内容的区域——换句话说，就是没有工具栏和按钮的网络浏览器。如果你设置页面宽度为800px，那么400px=50vh=50%。1.px、em、rempx的区别是固定像素，一旦设置，就不能改变以适应页面大小。Em和rem比px更灵活。它们是相对长度单位，也就是说长度不固定，更适合响应式布局。em和rem的区别用一句话总结就是：em是相对于父元素的，rem是相对于根元素的。rem中的r表示根（root），这个不难理解。2、vw、vh和%百分比%的区别是设置的相对于父元素大小的比例，而vw和vh是由窗口的大小决定的。vw和vh的优点是可以直接获取高度，但是在不设置bodyheight的情况下使用%不能正确获取可见区域的高度，所以这是一个很好的优点。3、vmin和vmax的使用在开发手机端页面时，如果使用vw和wh设置字号（比如5vw），那么竖屏和横屏显示的字号是不一样的。由于vmin和vmax是当前较小的vw和vh和当前较大的vw和vh。这里可以使用vmin和vmax。使横屏和竖屏的文字大小一致。
