css - 在图像悬停时更改颜色文本(文本位于图像 ex : img > div: p) 下的 div 中

Question

我正在尝试选择图像标签下的 div 内的元素，以在图像悬停时触发颜色变化。

能否请您指出哪里做错了，或者是否可以这样做？

img.topic-hover:hover div.post-information ~ p.topic  {
	color: rgb(88, 202, 230);
}

img {
  width: 30px;
  height: 30px;
 }
    

<img class='topic-hover' src='http://s28.postimg.org/61z157tz1/post1.jpg'>
<div class='post-information'>
  <p class='topic'>Text</p>
</div>

Answer 1

你写错了你的选择器:img.topic-hover:hover + div.post-information p.topic 或 img.topic-hover:hover ~ div.post-information p.主题 会起作用

img.topic-hover:hover + div.post-information  p.topic  {
	color: rgb(88, 202, 230);
}

img {
  width: 30px;
  height: 30px;
 }

<img class='topic-hover' src='http://s28.postimg.org/61z157tz1/post1.jpg'>
<div class='post-information'>
  <p class='topic'>Text</p>
</div>