header+main+footer
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
header{
height: 60px;
background-color: red;
}
.main{
/*calc()计算属性 记住中间一定要有空格
vh表示当前浏览器多高他有多高*/
height: calc(100vh - 120px);
background-color: aquamarine;
}
footer{
height: 60px;
background-color: #000;
color: #fff;
}
</style>
</head>
<body>
<!--头部-->
<header>
头部
</header>
<!--主体-->
<div class="main">
</div>
<!--底部-->
<footer>
<!-- 版权-->
©CollAnan
</footer>
</body>
</html>