css實現div的高度填滿剩餘空間

css實現div的高度填滿剩餘空間
方式1:絕對定位
.top{
width: 100%;
height: 70px;
}
.bottom{
background-color: #cc85d9;
width: 100%;
position: absolute;
top: 70px;
bottom: 0px;
left: 0px;
}

方式2：border-sizing
html,
body {
height: 100%;
padding: 0;
margin: 0;
}
.container {
height: 100%;
padding: 70px 0 0;
box-sizing: border-box;
}
.bottom {
height: 100%;
background: #fd9740;
}
.top {
height: 70px;
margin: -70px 0 0;
background: #61e1f6;
width: 100%;
}
或者
.top {
height: 70px;
position: absolute;
top: 0;
left: 0;
background: #61e1f6;
width: 100%;
}