纯css多级菜单的解决办法_html/css_WEB-ITnose
程序员文章站
2023-12-30 12:25:40
...
用ul li做一个无限级下拉菜单
css写 #nav ul li ul{ display:none}
#nav ul li:hover ul{ display:bock}
这样的话鼠标悬停到一级菜单就会展开二级及它的三四五六七八九级全部子菜单
只好再写 #nav ul li:hover ul li ul{ display:none}
如果有几十级 岂不是要傻乎乎的写 #nav ul li ul li ul ... li:hover ul li ul以阻止鼠标悬停的下下级显示????
高手们如何解决这个问题呢
css写 #nav ul li ul{ display:none}
#nav ul li:hover ul{ display:bock}
这样的话鼠标悬停到一级菜单就会展开二级及它的三四五六七八九级全部子菜单
只好再写 #nav ul li:hover ul li ul{ display:none}
如果有几十级 岂不是要傻乎乎的写 #nav ul li ul li ul ... li:hover ul li ul以阻止鼠标悬停的下下级显示????
高手们如何解决这个问题呢
回复讨论(解决方案)
js来解决 纯css有兼容问题,毕竟hover 只有a在所有浏览器下支持
http://bbs.csdn.net/topics/390686370
http://jingyan.baidu.com/article/9f63fb91f5e897c8400f0e06.html 多级的CSS
http://www.wzsky.net/html/Website/CSS/113149.html
#nav li ul{ display:none}
#nav li:hover>ul{ display:bock}
#nav li ul{ display:none}
#nav li:hover>ul{ display:bock}
高手,一个 > 就解决问题。
推荐阅读
-
纯css多级菜单的解决办法_html/css_WEB-ITnose
-
一款纯css3实现的机器人看书动画效果_html/css_WEB-ITnose
-
JSP实现左边是树形菜单,右边是对应的内容显示_html/css_WEB-ITnose
-
一个纯CSS写的登录的样式_html/css_WEB-ITnose
-
请问下,webapp里面长按页面弹出来的菜单可以隐藏或者更改么_html/css_WEB-ITnose
-
IE下自己制作选项卡菜单类中遇到的iframe缓存问题_html/css_WEB-ITnose
-
CSS3 实现的一个简单的"动态主菜单" 示例[转]_html/css_WEB-ITnose
-
还在为小三角形切图?使用纯CSS写一个简单的三角形_html/css_WEB-ITnose
-
在字符串资源文件中添加HTML元素,直接使用字符串资源,HTML元素没起作用的解决办法_html/css_WEB-ITnose
-
一款纯css3实现的颜色渐变按钮_html/css_WEB-ITnose