css - img 翻转影响同一 div 中的文本

Question

我有一个 div，其中包含一个 img 和一个位于其下方的标题。有一个环绕整个 div 的超链接。当我将鼠标悬停在图像上时，如何使文本链接悬停状态显示？这是到目前为止的html：

<a href="#"><div id="box" class="image-hover">
<img src="images/image.jpg"></img><p class="title">Title goes here</p></div></a>

CSS:
.image-hover a {background-color: white;}
.image-hover a:hover {background-color: navy;}
.image-hover a:active {background-color: navy;}

Answer 1

超<a>链接是一个内联元素。是<div>块级元素。div将 a放在a元素内部是不对的。更改您的代码，例如替换div和span给予display: block;，然后尝试。