html - CSS 基于父 div

Question

不确定我的标题是否传达了我的总体问题，但这里是。

我有类似这样的 HTML:

<div id="nav">
    <ul id="menu">
        <li><a href="#">Menu Item</a></li>
        <li><a href="#">Another Menu Item</a></li>
    </ul>
</div>

一些CSS:

#menu {
    font-family: Arial;
    font-size: 12px;
}
#menu > li > a {
    color: #fff;
}
#menu > li:hover > a {
    color: #fff;
    text-decoration: underline;
}

在我的主页上，我将链接设置为颜色:白色； 我只想在几个产品页面上将 class="productmenu"添加到父 div，并让我的 css 将菜单字体颜色更改为黑色。

<div id="nav" class="productmenu">

我该怎么做？

谢谢!

Answer 1

再添加一条 CSS 规则:

.productmenu #menu > li > a {
    color: #000;
}