html怎么在页面最底部,怎么只用css实现按钮一直在页面的最底部

要实现的效果：

如果上面元素较少，提交按钮在屏幕底部，如果上面元素较多，接近一屏，或者超过一屏，按钮随之下移。

需要以下几点：

1、按钮和上面元素在一个div中，父div相对定位，需要居底的div绝对定位。

2、父div min-height: 100vh。

3、父div设一个伪类，伪类设置一定高度，或者直接用padding-bottom。

如果不写第三条，在某种情况下会有问题。

当list总条数接近屏幕底部的时候,列表会被按钮挡住：

完整demo:

Title

body{

border: 0;

margin: 0;

}

.cont{

position: relative;

min-height: 100vh;

padding-bottom: 95px;

box-sizing: border-box;

}

.cont .list {

height: 65px;

line-height: 65px;

border-bottom: 1px solid #F2F2F2;

text-align: center;

font-size: 15px;

background-color: #ffffff;

}

.btn {

position: absolute;

text-align: center;

bottom: 0;

font-size: 16px;

color: #FFFFFF;

margin: 25px 0;

width: 335px;

height: 45px;

line-height: 45px;

background: #E0E0E0;

border-radius: 5px;

background-color: #1B68FD;

left: 50%;

transform: translateX(-50%);

}

list

list

list

list

list

list

list

list

list

list

list

list

list

按钮