如何定位嵌套列表的“悬停”

Question

如果我设置可见性：隐藏在嵌套的li元素上，如何在悬停时将其设置回来？

例如

#menu li ul li {
visibility: hidden;
}

我试过了：

#menu li ul li:hover {
visibility: visible;
}

但它不起作用 - 很明显我没有正确的语法！

欢呼声

Answer 1

visibility: hidden隐藏元素并且不会留下任何可移动的表面，因此永远不会触发hover事件。

尝试opacity: 0（甚至opacity: 0.00001，现在不确定表面是否保留0）以获得所需效果。注意IE＆lt; 8需要特殊待遇（filter: alpha(opacity=0)）

其他浏览器也需要其他opacity设置，请查看@Nick Craver的完整列表链接。

Answer 2

为什么不在每个＆lt; li＆gt;中添加子包装器？像这样（可能是p或div）：

<li><p>dadada</p></li>

然后，为造型：

#menu ul li p {
 visibility: hidden;
}

#menu ul li:hover p {
 visibility: visible;
}