CSS结构化悬停状态

Question

我正在修改一个现场magento网站的设计。我遇到了一个问题。 我想让锚点悬停状态彼此独特，我试过这段代码发现它不起作用。

#cssmenu > ul > li > a > #nav-eq:hover{background-color:red; } 

这是输出结构：

<div id="cssmenu">
<ul>
<li><a id="nav-h"></li><li><a id="nav-eq"></li><li><a id="nav=brand"></li>
</ul>
</div>

对于我做错了什么，我将不胜感激。

Answer 1

由于元素具有id，因此您（可能）不需要更具体的内容：

#nav-eq:hover {
    background-color: red;
}

如果由于某种原因你确实需要一个更具体的选择器：

#cssmenu > ul > li > a#nav-eq:hover {
    background-color: red;
}