<body>
<div class="wrapper">
<div class="content">
<ul>
<li>内容</li>
<li>内容</li>
<li>内容</li>
<li>内容</li>
<li>内容</li>
</ul>
</div>
<div class="footer"></div>
</div>
</body>
*{
padding: 0;
margin: 0;
}
html,
body{
height: 100%;
}
.wrapper{
position: relative; // 关键
box-sizing: border-box;
min-height: 100%; // 关键
padding-bottom: 100px; // 该值设置大于等于按钮的高度
ul{
list-style: none;
li{
height: 100px;
background: lightblue;
}
}
}
.footer{
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 100px;
background: orange;
}