html - 如何在给定的总高度上堆积几个 DIV，在一个 DIV 上垂直滚动（不带 JS）
问题描述
我有一个由 3 部分组成的页面：1 个标题部分必须始终可见并位于视口顶部，1 个内容部分必须可滚动，1 个尾随部分必须始终可见并位于视口底部。
我不想你使用任何 JS，也不想使用 Expression。我已经找到了许多仅使用 CSS 的答案，但都假设标题和预告片的高度是恒定的且已知的，这不是我的情况。
我的想法仍然是在 BODY 和 DIV 上使用高度和溢出属性，以便可以使其中一个 DIV 可滚动，并具有最大可用显示高度。但到目前为止还没有找到可行的解决方案。
我已经尝试过了（只有 2 个部分，标题和内容）：
<body style="overflow: hidden; height: 100vh">
<div id="MyHeader"> blablabla </div>
<div id="MyContent" style="overflow: scroll;">
<P>Many lines of content ...</P>
</div>
我确实在内容 DIV 上看到了 v-scroll bar，但它是全高且无效的，所以我根本看不到它的溢出部分。
注意：如果这不是正确的方法，我可以考虑使用 1-col 表，总高度设置为 100vh，并且一个单元格可进行 v-scrollable。但我已经看到这更棘手，并且可能对某些浏览器有副作用....
解决方案
这可以通过 position sticky
Set header and footer to position sticky with top: 0for header and bottom: 0footer来实现。