页面元素高度固定,中间的元素需要撑满屏幕,或者内容多时显示滚动条时,我们要把父元素设置为height:100vh
<div class="parent"> <div class="header"> </div> <div class="content"> </div> <div class="footer"> </div> </div>
.parent{ display: flex; height: 100vh; } .header{ height: 100px; } .content{ flex: 1; } .footer{ height: 100px; }