在制作网站过程中，正常网页高度够用时会自动把footer挤到底部，但不是所有页面都是有内容的，这时候就会出现footer跑到网页中间，而且底部露出一大段空白的现象。这时我们应该如果通过css让footer始终固定在底部呢？今天介绍下通过css的flex属性来实现，具体请看下面的代码：
假设网页代码如下：
<html>
<head></head>
<body>
<div class="content"></div>
<footer></footer>
</body>
</html>
可使用如下css代码来显示footer固定底部
<style>
body{
display: flex;
min-height: 100vh;
flex-direction: column;
}
.content{
flex: 1;
}
</style>参考上面的HTML和css代码就可以实现footer固定在底部了，如果你也遇到了这样的问题，就试试看吧。
如果内容有帮助，就点个赞吧！