如何設置嵌套列表的「懸停」

Question

如果我設置了可見性：隱藏在嵌套的li元素上，如何將其設置爲懸停？

例如。

#menu li ul li { 
visibility: hidden; 
} 

我想：

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

但它不工作 - 這麼清楚我沒有語法正確的！

歡呼

Answer 1

visibility: hidden隱藏元素，不留hoverable表面，所以絕不會有一個hover事件觸發。

嘗試opacity: 0（或甚至opacity: 0.00001，目前還不確定表面是否保留0）以獲得所需的效果。請注意，IE < 8需要特殊處理（filter: alpha(opacity=0)）

其他瀏覽器還需要其他opacity設置，請查看@Nick Craver的鏈接獲取完整列表。

Answer 2

爲什麼不能在每個<裏添加子包裝>這樣的（可能是AP或者一個div）：

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

然後，對於造型：

#menu ul li p { 
visibility: hidden; 
} 

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