html
<div class="content">
main-content
</div>
<div class="footer">footer-content</div>
css
.content{
min-height:calc(100vh - 50px);//重点
}
* {
box-sizing: border-box;//重点
}
.footer{
height:50px;
background:blue;
}
注
calc方法里,减号“-”左右两端要加上空格,否则方法不起作用