Css 主菜单颜色更改

我试图将目标指向我在jfiddle中加载的下拉菜单的标题元素：

我试图得到它，所以当你翻滚到nav ul li时，它会显示黑色而不是红色。以下是我本以为可以做到的几句话

nav ul li {float: right; width: 172px; height: 35px; background-color: red;}
nav ul li:hover > ul {display: block; text-align: left; background-color: black;}

以下是HTML：

<nav>
<ul>
    <li><a href="#">BUTTON IMAGE</a>
        <ul>
            <li><a href="#">Accreditation Client Login</a></li>
            <li><a href="#">Training Client Login</a></li>
            <li><a href="#">Training Registration</a></li>
            <li><a href="#">Guardian Tracking</a></li>
        </ul>
    </li>
</ul>
</nav>

---

有人能告诉我为什么导航ul-li：hover不起作用，它和ul有什么关系。当我移除它时，它会破坏菜单。谢谢你，弗兰克

只需添加

导航ul li:悬停{
背景色：黑色；
}

---

我可以发誓我做到了。。。我讨厌css：（谢谢！就是这样！我按照你的建议做了更改。但是下拉菜单现在看起来很奇怪。如果你在这里滚动按钮图像，然后在菜单上跳下来。你知道是什么原因吗？再次感谢！我发现了…我肯定是图像的css语法有问题。这是最后的css它：去掉

nav ul ul li

上的

浮动

和

位置

。如果您想让文本变为红色，请签出