html - 鼠标悬停时显示子子菜单

Question

我有这个代码:http://jsfiddle.net/7Zr44/

我想在鼠标悬停时显示子子菜单。

display:block 没有做任何事情

<ul class="tonho">
<li><a href="">Menu 1</a>

    <ul class="tonho"><li><a href="">Sub 1.1</a>
        </li>
        <li><a href="">Sub 1.2</a></li><li><a href="">Sub 1.3</a>
        </li>
    </ul>
</li>
<li><a href="">Menu 2</a>
            <ul class="tonho"><li><a href="">Sub 2.1</a>
            <ul class="tonho"><li><a href="">Sub Sub 2.1.1</a>
                </li>
                </ul>                 
                </li>
                <li><a href="">Sub 2.2</a></li>
</ul>
</li>
<li><a href="">Menu 3</a></li>

编辑:我不能给 1 级、2 级等，因为这个菜单是由 PHP + SQL 脚本生成的。

Answer 1

您需要取消隐藏 li 标签并仅显示下一级 Ul。像这样:Demo

.tonho li:hover > ul {
    display: block;
}