防止HTML表溢出包含的div

我的目标是在顶部有一个固定区域，然后在剩余的可用区域有一个表（带滚动条）。为了问这个问题，我简化了这个问题

我试着用一个特定大小的div（在本例中为300x300像素）来实现这一点，在本例中显示为青色，这包含一个有两行的表，顶部一行包含标题，然后第二行包含div，这又包含了我想要滚动的数据表

表{边框折叠：折叠；}
表，th，td{边框：1px实心灰色；}
table.nowrap{空白：nowrap；}

这是静态标题
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目
表中的项目表中的项目表中的项目

有许多比使用table更好的方法来实现这一点，但我将适合您的方法

这是将获得所需结果的全部html代码（只需阅读注释即可查看更改）：

桌子
桌子{
边界塌陷：塌陷；
}
桌子
th，
运输署{
边框：1px纯色灰色；
}
表1.nowrap{
空白：nowrap；
}
这是静态标题
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项
表中的一项