如上圖的樣式，制作過(guò)程。

HTML

<div className="pageWrap"><MainHeader /><main className="main"></main><MainFooter /></div>

CSS

.pageWrap{display: flex;min-height: 100vh;flex-direction: column; } .main{flex:1; }

總結(jié)

以上是生活随笔為你收集整理的如何设置顶部和底部固定，中间填满的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。