仅使用 CSS 用 #second 响应式填充垂直空间
问题：
如何我们只使用CSS填充#wrapper中#first下的剩余垂直空间？
解决方案：
要实现这一点，我们可以利用CSS中的flexbox属性：
<code class="css">html, body {
height: 100%;
margin: 0;
}
.wrapper {
display: flex;
flex-direction: column;
width: 300px;
height: 100%;
}
.first {
height: 50px;
}
.second {
flex-grow: 1;
}</code>HTML:
<code class="html"><div class="wrapper"> <div class="first" style="background:#b2efd8">First</div> <div class="second" style="background:#80c7cd">Second</div> </div></code>
说明：
以上是如何仅使用 CSS 用 Div 填充剩余的垂直空间？的详细内容。更多信息请关注PHP中文网其他相关文章！
