vh与vw

1. vh

vh是当前屏幕可见高度的1%，height:100vh == height:100%;

注意：当元素没有内容时候，设置height:100%该元素不会被撑开，但是设置height:100vh，该元素会被撑开，其高度与屏幕高度一致。

2.vw

vw就是当前屏幕宽度的1%

注意：设置width:100%，被设置元素的宽度是按照父元素的宽度来设置，

但是100vw是相对于屏幕可见宽度来设置的，所以会出现50vw 比50%大的情况

3.应用

设置高度或宽度的时候, 需要借助函数calc() 来动态计算长度值。

• 运算符前后都需要保留一个空格，例如：width: calc(100% - 10px)；
• 任何长度值都可以使用calc()函数进行计算；
• calc()函数支持 “+”, “-”, “*”, “/” 运算；
• calc()函数使用标准的数学运算优先级规则；