在命名元素内部超链接css特异性

Question

http://jsfiddle.net/DkAqZ/9

HTML

<div id="container">
    <div>default black text</div>
    <div><a href="#">default red link</a></div>
    <div id="inner">
        <div>#inner green text</div>
        <div><a href="#">#inner red link or green text?</a></div>
    </div>
</div>

CSS

body {
    color:black;
}
a {
    color:red;
}
a:hover {
    color:orange;
}
#inner {
    color:green;
    font-size:24px;
}

看起来像这样

我并不完全清楚为什么第二个超链接是红色而不是绿色。 #inner高于a的特异性？此外，字体大小IS继承在#inner a上，因此更加令人困惑。

Answer 1

不，我很确定事实并非如此。如果你这样做了：

#inner a { color:inherit}

我认为这样可行，没有机会尝试，抱歉。

修改

这更能说明情况：when will "a" tag not inherit color attribute of parent tag?

嗯......好吧，我刚刚看到你那个漂亮的jsfiddle例子。这是非常好的。删除href似乎无法解决问题，但我的解决方案仍然有效。