Chrome中字体系列的奇怪css优先级行为

我需要为我的菜单定制样式。在IE中，它工作正常，但在Chrome中，我发现我无法修改菜单中链接的字体系列。对于span或div中的文本，这是可以的。我使用简单选择器使我的规则优先于默认规则。但开发工具显示如下：

您可以看到我的规则没有覆盖默认规则。我尝试添加重要的开发工具，如下所示，但字体根本没有改变：

我唯一想让我的规则起作用的就是删除“Menu.CSS”中的原始CSS规则“.tundra.dijitMenuItem”。但这是框架给出的默认规则，我不想修改它

dom中的元素如下所示：

这是怎么发生的，如何让我的规则起作用

更新：我尝试了许多方法来测试这些行为。似乎只要我将规则设置为.dijitMenuItem或其子项，它就可以覆盖默认值。否则，无论我的选择器有多具体，它都不会被应用。我举了一个简单的例子如下：完整的例子如下：

---

有人能解释一下吗？字体族的继承和重写是否与其他CSS属性不同？

尝试在锚定标记中设置字体族。我认为这应该是可行的。

受影响元素的HTML是什么？@Juhana，问题中的HTML已更新。它是弹出div中的锚，但没有规则中指定的任何类？@Juhana，是的，因为我需要所有文本，无论锚、span或div在弹出窗口中使用相同的字体系列。我必须为锚定设置它吗？这个例子不起作用，仅仅因为你拼错了“sans serif”。是的，它起作用了。但我想知道为什么“.tundra.dijitMenuItem”可以在“.tundra.dijitMenuPopup.menu popup”之前。如果你想所有字体都一样，请在正文中设置字体系列。如果我的答案对你有帮助，请接受。但正如我在这里所说的，我需要将其应用于popup div中的所有项目。因此，我不能仅为锚设置它。然后将规则放到body或container div中，两者都不起作用。

.theme .sub-container
{
  font-family: Arial; 
}

body.theme div.container
{
    font-family: sans-serif; //this doesn't work
}



.theme .sub-container2
{
    font-family: sans-serif;
}
body.theme div.sub-container2
{
    font-family: Arial; //this works
}