Html 鼠标悬停在图像上时链接不显示

我有一个滚动图像，目标是当用户将鼠标移到图像上时，图像变暗（我使用滚动图像实现了这一点），并显示两个标题为“了解更多”和“访问站点”的链接（它们应该显示在图像上）。在我开始设计风格之前，我想确保一切正常，我的问题是链接似乎根本没有出现。我做错了什么，我应该修复，以便能够看到链接时，图像被鼠标移过

该网站的问题是，你可以看到，如果你鼠标在其中一个图像的链接没有出现。我的代码如下

HTML

---

您有.options{visibility:hidden；}，因此无论其中包含什么内容，它都是不可见的。您至少应该在以下时间将其更改为可见。选项：悬停。

您的

css

选择器有问题

#example1:hover.options {
visibility:visible;
}

将选择器替换为类似以下内容：

#example1:hover > .options {
    visibility:visible;
}

这应该行得通

#example1:hover.options {
visibility:visible;
}

#example1:hover > .options {
    visibility:visible;
}