将鼠标悬停在卡上的任何内容上时，如何更改文本的颜色？

Question

当我将鼠标悬停在卡片（类别h4）上时，我想更改类别为info的div中标题元素card的颜色。

我已经尝试了下面的代码，但是没有用。

.card:hover info h4 {
  color: blue;
}

<div class="card">
  <div>
    <div class="a"></div>
  </div>
  <div class="footer"></div>
  <div class="info">
    <h4> hello </h4>
  </div>
</div>
</div>

有人可以帮我这个忙吗？谢谢。

Answer 1

info类的语法不正确

.card:hover .info h4 {
  color: blue;
}

<div class="card">
  <div>
    <div class="a"></div>
  </div>
  <div class="footer"></div>
  <div class="info">
    <h4> hello </h4>
  </div>
</div>
</div>