CSS下拉菜单:Hover不做任何事情

Question

简短的甜蜜:为什么不:hover显示隐藏的内容？我已经尝试过所有的东西display: block:了#trigger a:hover.

这是测试用例:http://jsfiddle.net/5egvV/

Answer 1

两个问题:

1.错误的CSS选择器

你有:

#trigger:hover ul ul {

它应该是:

#trigger:hover ul {

2.错误的HTML

你有:

<li id="trigger"><a href="#" title="#">Mainitem 1</a></li>
    <ul>
        <li><a href="#">Subitem 1</a></li>
        <li><a href="#">Subitem 2</a></li>
        <li><a href="#">Subitem 3</a></li>
    </ul>

它应该是:

<li id="trigger"><a href="#" title="#">Mainitem 1</a>
    <ul>
        <li><a href="#">Subitem 1</a></li>
        <li><a href="#">Subitem 2</a></li>
        <li><a href="#">Subitem 3</a></li>
    </ul>
</li>

<ul> 应该进去 <li>