Chrome中字体系列的奇怪css优先级行为[关闭]

Question

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

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

我试图让我的规则发挥作用的唯一方法是删除“Menu.css”中的原始 CSS 规则“.tundra .dijitMenuItem”。但这是框架给的默认规则，我不想修改。

dom中的元素如下图所示：

这怎么会发生，如何让我的规则发挥作用？

更新：我尝试了很多方法来测试这些行为。好像只要我把我的规则放到 .dijitMenuItem 或者它的孩子上，它就可以覆盖默认值。否则，无论我的选择器多么具体，它都不会被应用。我做了一个简单的例子如下：完整的例子在JsFiddle:

.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
}

谁能解释一下？ font-family 的继承和覆盖是否与其他 CSS 属性不同？

Answer 1

尝试在锚标记中设置字体系列。我认为它应该工作。