我已经完成了2级导航,并且希望添加第三级...尽管阅读并尝试引用其他一些CSS代码,例如CSS Drop Down Navigation, 3rd level issuehttp://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/

谢谢您的帮助...抱歉,如果我的问题使您感到困惑...

附言当我完成导航栏时,我将整理我的代码...很抱歉,如果代码不整洁。

最佳答案

这可能是一个不错的起点。我查看了您的代码,但看起来有些复杂,因此我修改了我编写的旧下拉列表。

JSFiddle here

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

以下是一些帮助我编写CSS下拉菜单的提示:


将样式和功能分开
把事情简单化
完成一个子菜单后,您将完成无数个子菜单。您需要做的就是简单地为每个其他子菜单重复相同的代码,并确保在ul中选择正确的css


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

关于html - 需要一些帮助在导航上创建第三级菜单,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/12887570/

10-13 01:33