CSS Calc视口单位的解决方法？

在我回答这个问题之前，我想指出一下，Chrome和IE 10+实际上支持带视口单位的计算。

FIDDLE) （在IE10 +中）

解决方案（对于其他浏览器）：调整大小

1）首先将高度设为100vh。

2）将box-sizing设置为border-box-添加75vw的padding-top。这意味着填充将是内部高度的一部分。

3）只需将多余的padding-top抵消为负的margin-top-top

div{        height: 100vh;    margin-top: -75vw;    padding-top: 75vw;    -moz-box-sizing: border-box;    box-sizing: border-box;    background: pink;}