CSS级联优先级

Kem*_*ief 2 css html5 class

我有这个HTML,我正在尝试样式:

<div id="menubar">
    <menu id="menubarTransportControls">Foobar</menu>
</div>
Run Code Online (Sandbox Code Playgroud)

谁能解释为什么这个CSS ......

#menubar menu {
    width: auto;
}
Run Code Online (Sandbox Code Playgroud)

......优先于......

#menubarTransportControls {
    width: 100%;
}
Run Code Online (Sandbox Code Playgroud)

我正在使用IE5与HTML5 shiv javascript.谢谢

thi*_*dot 6

#menubar menu具有更高的特异性#menubarTransportControls.

要了解特异性:

如果您愿意,可以使用此计算器:

http://www.suzyit.com/tools/specificity.php

Selector                    Score (a,b,c,d)
#menubar menu               0,1,0,1
#menubarTransportControls   0,1,0,0
Run Code Online (Sandbox Code Playgroud)

请务必阅读上述一些资源,以了解"分数"的含义.