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>