Css 在div上使用悬停不起作用

您可以访问该网站（单击“公文包”以访问此问题的相关部分）

我正在尝试设置一个标题，以便在图像悬停时显示。我设置了图像和文本的格式，以便在悬停时显示。我将div的可见性设置为hidden，并使用hover标记使其可见，但在悬停时它拒绝再次出现。如何使div在悬停时实际出现

这是我的HTML（只是第一个简短的帖子）

---

当您将鼠标悬停在容器上时，尝试更改可见性。您可以执行以下操作：

.imgwrap:hover .textwrap {
     visibility: visible;
}

---

您只需将鼠标悬停在

imgwrap

类上，即可控制

textwrap

的属性。基本上，您只是使用鼠标悬停在父对象上，然后指定子对象；在本例中，

textwrap

。由于您不能将鼠标悬停在隐藏的元素上，因此我们将鼠标悬停在它的父元素上，这是我们希望能够悬停的区域。

您不能将鼠标悬停在

可见性：隐藏的
或
显示：无
样式化元素上，因为鼠标无法悬停。请尝试使用javascript onmouseover=“function（）”。。。显示/隐藏描述框。我想你应该试试这个，以便在悬停时获得更好的动画效果。看看这个，我刚做的。这有用吗？这正是我所需要的。一旦时间限制到期，我将标记为正确。@bjb567这正是因为Adam在OP的第一条评论中所说的。您不能将鼠标悬停在隐藏的元素上，因此在本例中，我们要使用父元素，这正是我们希望悬停在上面的区域。@Sam因此，将其添加到您的答案中，使其完整。
.imgwrap {
height:150px; width:150px;
}

.textwrap {
position:absolute;
width:150px; height:30px;
background-color:#727272;
margin-top:-30px;
visibility: hidden;
}

.imgdes {
text-align:center; font-family: Droid serif, serif;
font-weight:500; font-size:14px;
line-height:30px;
text-decoration:none; color:#f7f7f7;
top:50%;
}

.textwrap:hover {
visibility: visible;
}

.imgwrap:hover .textwrap {
     visibility: visible;
}