如果div具有`top`屬性，如何使div相對於屏幕的高度為100％

Question

我的div塊有一個top='70px'屬性。 當div有滾動條時，他的也向下移動，滾動條的末端是不可見的。
我在 div 中添加了以下屬性，但沒有幫助：

div {
    max-height: 100vh;
    overflow: auto;
}

例子：

 *, *::before, *::after { padding: 0; margin: 0; border: 0; box-sizing: border-box; } div { position: fixed; top: 70px; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); padding: 30px 30px 30px 30px; max-height: 100vh; overflow: auto; } div::before { content: ""; position: fixed; width: 100%; top: 0; left: 0; height: 70px; background-color: #222; z-index: 2; }

 <div> <ul> <li><a href="">Section #1</a></li> <li><a href="">Section #2</a></li> <li><a href="">Section #3</a></li> <li><a href="">Page #1</a></li> <li><a href="">Page #2</a></li> <li><a href="">Page #3</a></li> <li><a href="">Page #4</a></li> <li><a href="">Page #5</a></li> <li><a href="">Page #6</a></li> </ul> </div>

Answer 1

您可以使用calc()從屏幕總高度中減去 div 的top ，如下所示

div {
  top: 70px;
  height: calc(100vh - 70px);
}