Css显示悬停我的导航

Question

我通常没有问题与CSS，我做了这个导航菜单本人，但我似乎无法理解为什么它不会显示我的div时，我将鼠标悬停在项目上。 ..我创建的jsfiddle @http://jsfiddle.net/LuLTM/所有的代码，以及...

#beautyworld #beautyhealth {display:none;} 
#beautyworld #beautyhealth:hover {color:black;display:block!important} 

我想，当悬停在DIV #beautyworld的DIV #beautyhealth出现......我只是不明白，为什么我的CSS是不工作....可能有人请指教？谢谢你

Answer 1

我认为问题在于你正试图让火悬停在当前'display：none'的东西上。由于显示器没有折叠元素，所以没有什么可以悬停的。你留意将它悬停在相对父母级别，以引起孩子的显示。

例如：

#beautyworld > div { display:none; } 
#beautyworld:hover > div { color:black; display: block !important; }