使div填充剩余屏幕空间的高度

使div填充剩余屏幕空间的高度可以通过设置高度和清除浮动实现。以下是一个可能的实现：

1. 设置父div的高度为浏览器窗口的高度：<div style="height:100vh; overflow:auto;"> <!-- 子元素要填充剩余屏幕空间高度的div --> </div><div style="height:400px; float:left;"> <!-- 需要浮动的子元素 --> </div> <div style="height:100%; overflow:auto;"> <!-- 填充剩余屏幕空间高度的子div --> </div><div style="height:100vh; display:flex; flex-direction:column;"> <!-- 左侧子div要填充剩余屏幕空间的高度 --> <div style="flex-shrink:0;width:50%; float:left;"> <!-- 需要浮动且可以垂直居中的子元素 --> </div> <!-- 右侧子div高度设置为容器高度 --> <div style="flex-basis:100%; overflow:auto;"> <!-- 填充剩余屏幕空间高度的子div --> </div> </div>通过这个方案，你将能够让一个div填充剩余屏幕空间的高度，并根据具体场景合理设置高度、浮动等样式。
2. 在子div中设置overflow:auto来清除浮动：
3. 使用display:flex将子div填满父div：