如何调整<a> element?</a>中的文字悬停颜色

Question

这是控制整个网站上的文字悬停颜色。

a:hover{color: #4B9397;}

我有“a”元素，我想在其中覆盖文本悬停颜色。请参阅下面的设置

<a href="/link.html">
<div class="event-item">
<img src="../image.jpg"/>
<h2>Heading</h2>
<p>Link Text</p>
</div>
</a>

我尝试过这个并没有用。

event-item a:hover{color: #newcolor;}

我做错了什么？

Answer 1

你倒退了，错过了.

a:hover .event-item { color: #newcolor; }

---

我建议这样做：

<a href="/link.html" class="event-item">
    <img src="../image.jpg"/>
    <h2>Heading</h2>
    <p>Link Text</p>
</a>

---

a.event-item { display: block; }
a.event-item:hover { color: #newcolor; }