鼠标悬停时显示子子菜单

Question

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

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

显示：阻止什么都不做

<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标记，并仅显示下一级别的UI。像这样：Demo

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