Html 如何管理多个div'；高度和每个分区'；一个人的身高取决于另一个人？

，在这种情况下，容器区域的高度会自适应于屏幕的高度。标题区域始终位于容器顶部，其高度未知。底部区域始终位于容器底部，但其高度是恒定的。内容区域的高度取决于标题区域，因此如果三个区域的总高度小于屏幕高度，则内容区域可能为空白。当标题区域高度增加时，内容区域高度降低。“大于”表示底部区域高度和总高度不会改变。

---

我想知道是否有人知道如何做到这一点？

根据您的stackblitz演示，我认为这就是您想要的（如果没有，请告诉我）：

收割台区域高度未知，可能增加或减少。asdfasd
此内容区域高度取决于“标题区域”高度。如果三个区域的总高度小于
屏幕高度。收割台区域高度增加时，该区域高度降低。
该区域始终位于容器的底部，容器的高度是屏幕的高度。底部区域是
高度是一个常数。

.container{
显示器：flex；
弯曲方向：立柱；
&>* {
弹性收缩：0；
}
边框：1px纯红；
高度：100vh；
}
.标题{
保证金：5px；
边框：1px纯黑；
}
.内容{
弹性：1；
利润率：10px；
边框：1px纯黑；
}
1.底部div{
利润率：10px；
边框：1px纯色灰色；
}

谢谢，但有点不同。我想要的是：当标题高度增加时，内容高度降低，而不是向下移动。所有的空白都应该放在内容区域。好的，很容易修复。再看看Stackbliz演示（更新版）。谢谢，这正是我想要的。很抱歉，我是css新手