javascript - 我试图在悬停时显示 block 图像，但就是无法获取；使用 css3 和 Html

Question

首先，这是我的代码笔，我正试图将鼠标悬停在上面并让它谈论我。我尝试了一些方法，但就是没有点击。

这是我的链接

http://codepen.io/willc86/pen/BrEmt

我希望有人能帮我解释一下如何将其更改为纯色背景(假设全是红色)，字体为白色，上面写着“关于我”

没有 JavaScript 有可能吗？

Answer 1

诀窍是将鼠标悬停在更高的地方。

您不能将鼠标悬停在看不见的东西上。但是，您可以将鼠标悬停在持有不可见元素的事物上。

所以，与其做类似的事情:

.hidden:hover { visibility: visible; }

相反，把它放在父元素上，比如 li:

li:hover .hidden { visibility: visible; }

现在，当您将鼠标悬停在包含隐藏项的 li 上时，隐藏项就会出现。

现在只需调整容器即可为您提供所需的内容。 =)