Html 如何使用类覆盖css而不是使用id覆盖css？

在编辑wordpress主题时，我遇到了这些类型的问题。以下是html代码：

<nav id="site-navigation" class="main-navigation span8" style="margin-top:30px" role="navigation">

---

我只想覆盖

。主导航

属性，而不是

#站点导航

属性。

尝试删除该属性！从.main导航中选择重要信息。

删除！来自#站点导航的重要信息

删除！来自#站点导航李a的重要信息。或者如果需要，写上颜色：#efa9bd！重要的；作为内联css。如：

---

然后将样式包括在

#站点导航

选择器中。。。如果您出于任何原因无法访问该CSS，那么只需在您控制的CSS中覆盖这些样式即可。您还可以在树的更高位置包含一个ID，以获得更高的特异性（例如，

#someId.main navigation

您可以覆盖应用于ID选择器而不是类选择器的样式的唯一方法是使用

！important

，您应该不惜一切代价避免它。@putvande谢谢！我不知道这一点。

#site-navigation li a, #site-navigation li.home.current-menu-item a {
    color: #efa9bd !important;
}

.main-navigation .current-menu-item > a, .main-navigation .current-menu-ancestor > a, .main-navigation .current_page_item > a, .main-navigation .current_page_ancestor > a {
    color: #fff !important;
    font-weight: bold;
}