其他分享
首页 > 其他分享> > sticky footer布局

sticky footer布局

作者:互联网

sticky footer布局:当头部区块和内容区块内容较少时,页脚能固定在屏幕的底部,而非随着文档流排布;当页面内容较多时,页脚能随着文档流自动撑开,显示在页面的最底部

使用flex布局实现

.wrapper {
    display: flex;
    flex-direction: column;
    overflow: auto;
}
.content {
    flex: 1;
}
.footer {
    flex: 0;
}

标签:footer,flex,页脚,布局,sticky,文档,区块
来源: https://www.cnblogs.com/DIVEY/p/15716253.html