css 讓一個盒子的高度自適應屏幕剩餘的部分

描述：再項目中，移動端要自適應，因爲有時候數據不夠，因此致使了有的區域空白

要求：沒有數據的時候可以充滿屏幕，數據超出屏幕就出現滾動條

作法
1-讓容器高度充滿這個屏幕
在容器內容不多的狀況下，要想讓這個容器充滿整個屏幕：

`.container{

min-height:100vh;
display:flex

}`

2-讓容器高度充滿剩餘屏幕高度
要讓容器充滿屏幕的剩餘高度，用 vh 結合 flex 佈局就能夠實現。

`.content{

min-height:100vh;
display:flex

}
.header{

height:100px

}
.content{

flex:1

}
.footer{

height:100px

}`