悬停时的可见性不会改变

Question

我正在使用visibility属性在悬停下拉菜单的简单导航栏上工作。但是当我盘旋时，条件不会生效。这背后的逻辑是什么？

http://jsfiddle.net/MAvQp/

Answer 1

你的html格式不正确，ul应该是li不是兄弟姐妹的孩子

fiddle

Answer 2

您正尝试使用

显示子项目

ul li:hover ul{
    visibility: visible;
}

但子项ul未嵌套在li内，因此ul li ul与子项不匹配。因此，将您的html更改为

<ul>
    <li>Menu Item 1 
            <ul>
            <li>Sub-Menu1 Item 1</li>
            <li>Sub-Menu1 Item 2</li>
            <li>Sub-Menu1 Item 3</li>
            </ul>
    </li>
…

</ul>

另请参阅my forked fiddle。