1、vw、vh、vmin、vmax

vh、vw、vmin、vmax这四个单位都是基于视口的，含义如下：

（1）vw、vh

vw是相对视口（viewport）的宽度而定的，长度等于视口宽度的1/100。

 

假如浏览器的宽度为200px，那么1vw就等于2px（200px/100）。

 

vh是相对视口（viewport）的高度而定的，长度等于视口高度的1/100。

 

假如浏览器的高度为500px，那么1vh就等于5px（500px/100）。

 

（2）vmin、vmax

vmin和vmax是相对于视口的高度和宽度两者之间的最小值或最大值。

 

如果浏览器的高为300px、宽为500px，那么1vmin就是3px，1vmax就是5px；如果浏览器的高为800px，宽为1080px，那么1vmin也是8px，1vmax也是10.8px。