将鼠标悬停在图像上以在JavaScript中添加覆盖

如果一个div包装中有多个图像。我想在用户将鼠标悬停在图像上时在图像上添加覆盖。我正在尝试使用下面显示的代码

---

for（var i=0；i这只是一个css问题。只需将此添加到您当前拥有的内容中：

a {
  position: relative;
  display: inline-block;
}

.Wrapper {
    display: inline-block;
    left: 0;
}

.Center {
    display: flex;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    height: 100%;
}

我还删除了最后一个
文本
div，并将其文本添加到
中心
div，因为它触发了mouseout事件并使其闪烁


用于（var i=0；iit看起来是因为您在CSS中的绝对位置，包装器正好停留在您放置它的位置。顺便说一句，优化当前for循环的快速方法是将
document.getElementsByTagName
提取到循环外部，并将其作为局部变量，无需在循环的每次迭代中查询它们在循环内部again@Icepickle这只是我制作的一个示例代码。我在实际代码中以非常不同的方式迭代图像。谢谢！你能告诉我修复方法吗？我如何更改CSS来修复它？你也可以使用简单的CSS来完成