javascript - 设置覆盖高度等于父 div，不等于屏幕高度

Question

我想在鼠标单击事件时突出显示选择 div。为了实现这一点，我使用了这个代码片段

<div class="parent">
  <div class="overlay"></div>
  <div class="content">
    <div class="subcontent-1">
     ...
    </div>
    <div class="highlight">
    ...
    </div>
  </div>
</div>

为了覆盖，我使用了以下 css

.overlay{
    display:none;
    background: rgba(0, 0, 0, 0.44);
    z-index: 3;
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
}

但是这个叠加层只填充屏幕高度而不是整个页面高度（父 div 溢出屏幕高度） 这就是现在的样子 我想把这个叠加层拉伸到页面底部，而不是屏幕高度。

标签： javascripthtmlcss

Answer 1

尝试添加position: relative;到您的父 div。