以剩余页面高度的百分比设置表格的高度

Question

我有一个已经设计好的网页。在此标题部分占据了161px的高度。我剩下的剩余空间为mousedown。在这个空间中，我有两个表。我还希望该表具有滚动条。为此，我需要为此calc(100vh - 161px)和tbody设置高度。

我希望第一张桌子的高度为30％，第二张桌子的高度为70％，以便它可以在所有大于768px的设备上使用。

如何设置此桌子的高度？

Answer 1

我想这就是您要的。获得剩余的高度并将其乘以所需的百分比。

.my-first-table {
    height: calc((100vh - 161px) * 0.3);
}
.my-second-table {
    height: calc((100vh - 161px) * 0.7);
}