增强说唱导航 + 旋转木马 + 页脚保持相对高度

Question

我想知道是否可以保持家庭html的三个主要组件的相对高度。在这种情况下，引导导航 + 轮播 + 页脚。我想修改轮播的高度，使其始终在屏幕的 70% 左右，另外 20% 用于导航，10% 用于页脚。没有图像大小调整问题，因为轮播只有一种背景颜色，并且不是图像。html 结构如下所示：

这是小提琴：

<div></div>
https://jsfiddle.net/q4t8bupc/

谢谢！

Answer 1

请检查这个。

.header{height:20vh; background:#666}
.content{height:70vh; background:#ed0000;}
.footer{height:10vh; background:#03C;}

<div class="header"></div>
<div class="content"></div>
<div class="footer"></div>