sticky 布局

sticky 布局 (已经成熟)

.content{
    min-height: 100vh;
    padding-bottom: 100px;
}
.footer{
    height: 100px;
    position: sticky;
    bottom: 0;
}

1.父元素及祖先元素不能overflow:hidden或者overflow:auto属性。

2.必须指定top、bottom、left、right4个值之一，否则只会处于相对定位

3.父元素的高度不能低于sticky元素的高度

4.sticky元素仅在其父元素内生效

position:sticky 粘性定位的几种巧妙应用