Javascript CSS将一个div直接放置在另一个div上

我有一个div，里面有一些东西，例如，用户可以选择单击“x”来说“这不适用于我”

我不想删除这个div，而是想在它上面播放一个半透明的div

我开始使用一些复杂的javascript来确定我的div的大小和位置，并在上面创建一个新的div。脚本给出了一个大小和位置，在我看来大致正确，但重叠div被放在了错误的位置

然后我意识到（可能）有一种更简单的方法来做到这一点

我把一个等级为“blackout”的div放在我想要黑掉的div里面。blackout css类将可见性设置为hidden，因此javascript将在需要时将其设置为visible

我遇到的问题是，即使使用这种方法，我似乎也无法让它精确地填充父div所具有的矩形

我有

这填满了整个屏幕，而不仅仅是父分区

---

我需要更改什么才能使其仅填充父div？

在父div的CSS上：

overflow: hidden;

应该有用

这填满了整个屏幕，而不仅仅是父分区

我需要更改什么才能使其仅填充父div

您需要将

position:relative

添加到父级

div

这将把父

div

设置为

的“包含块”。blackout

：

如果

位置

属性的值为

绝对

，则包含 块是最近的祖先，换句话说，是最近的祖先 其

位置

属性具有

绝对值

之一的祖先，

固定的

，或

相对的

---

在此处阅读更多信息：

将

位置：相对

添加到父div，

溢出：隐藏

只会隐藏父div的外部

更改

位置：绝对至<代码>位置：相对
使用“位置：绝对”将其相对于下一个“位置：相对”div进行定位。如果没有一个设置，则将使用主体

您需要使父div CSS包含“position:relative”
将子级
宽度和
高度设置为100%，并删除无用的标记

您也可以使用：after而不是
@Derek:在这里使用
:after
是个坏主意。他想用JavaScript控制它，而伪元素很难用JavaScript控制。
overflow: hidden;