需要一些帮助在我的导航上创建第三级菜单

Question

我已经完成了2级导航，并希望添加第三级...尽管阅读并尝试引用其他一些css代码，例如CSS Drop Down Navigation, 3rd level issue和http://forums.asp.net/t/1758667.aspx/1，我仍然无法让我的代码工作。

我不确定我当前的代码是否允许我创建第三级导航。我不是一个CSS向导，但想检查是否有任何方法可以创建第三级。

我添加了第三级的内容，但创建CSS以使其显示失败。我尝试添加：

   #menu li ul li ul { display:none;}
   #menu li ul li:hover > ul{display:block; position:absolute; left:150px;}

给我css，但第三级没有出现

当我添加

时，我想检查第三级是否会出现

 #menu li ul ul { display:block;}
 #menu li ul li:hover > ul{display:block; position:absolute; left:150px;}

到我的css第三级出现，但我知道结果会很奇怪。

我当前代码的JSfiddle是：http://jsfiddle.net/eqNZd/5/

感谢您帮助我...对不起，如果我的问题困扰您......

P.S。当我完成导航栏时，我将整理我的代码...对不起，如果代码不整洁。

Answer 1

这可能是一个很好的起点。我查看了你的代码，但它似乎很复杂，所以我修改了我写的旧下拉列表。

JSFiddle here

这是一个非常基本的三层下拉列表。

以下是一些帮助我撰写CSS下拉列表的提示：

1. 保持风格和功能分开
2. 保持简单
3. 完成一个子菜单后，您已经完成了无数个子菜单。您只需为每个其他子菜单重复相同的代码，确保在ul中选择正确的css。

如您所见，标题ul只需要1个选择器，每个子菜单ul只需2个选择器才能运行菜单。您应该能够修改它以执行您需要的任何操作。