6级菜单
来源：互联网 发布：linux虚拟机root权限 编辑：程序博客网 时间：2024/05/16 00:48
<div class="menu">
<ul>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">菜单一</a>
<ul class="second">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">二级菜单_11</a>
<ul class="third">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">三级菜单_11</a>
<ul class="fourth">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">四级菜单_11</a>
<ul class="fifth">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">五级菜单_11</a>
<ul class="sixth">
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_11</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_12</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_13</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">五级菜单_11</a>
<ul class="sixth">
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_11</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_12</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_13</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">五级菜单_11</a>
<ul class="sixth">
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_11</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_12</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_13</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">五级菜单_12</a>
<ul class="sixth">
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_11</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_12</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_13</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]--></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_12</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_13</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_14</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">二级菜单_12</a>
<ul class="third">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">三级菜单_21</a>
<ul class="fourth">
<li><a href="http://www.cnblogs.com/rubylouvre/">四级菜单_21</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">四级菜单_22</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_22</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_23</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_24</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">菜单二</a>
<ul class="second">
<li><a href="http://www.cnblogs.com/rubylouvre/">二级菜单_21</a></li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">二级菜单_22</a>
<ul class="third">
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_21</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_22</a></li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">三级菜单_23</a>
<ul class="fourth">
<li><a href="http://www.cnblogs.com/rubylouvre/">四级菜单_21</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">四级菜单_22</a></li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">四级菜单_23</a>
<ul class="fifth">
<li><a href="http://www.cnblogs.com/rubylouvre/">五级菜单_21</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">五级菜单_22</a></li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">五级菜单_23</a>
<ul class="sixth">
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_21</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_22</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_23</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_24</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_25</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">六级菜单_26</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">菜单三</a>
<ul class="second">
<li><a href="http://www.cnblogs.com/rubylouvre/">二级菜单_31</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">二级菜单_32</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">菜单四</a>
<ul class="second">
<li>
<!--[if lte IE 6]><a href=""><table><tr><td><![endif]-->
<a href="http://www.cnblogs.com/rubylouvre/">二级菜单_41</a>
<ul class="third">
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_41</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_42</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_43</a></li>
<li><a href="http://www.cnblogs.com/rubylouvre/">三级菜单_44</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li><a href="http://www.cnblogs.com/rubylouvre/">二级菜单_42</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
//********************表现层部分*****************
<style type="text/css">
* {
margin:0;
padding:0;
}
.menu {
font-size:12px;
}
.menu li {/*水平菜单*/
float:left;
list-style:none;
position:relative;/*把包含块移动li元素*/
}
.menu a {
display:block;
height:32px;
width:100px;
line-height:32px;
background:#a9ea00;
color:#ff8040;
text-decoration:none;
text-align:center;
overflow:hidden;/*★★★★*/
}
.menu a:hover {
background:#369;
color:#fff;
}
/*新增的二级菜单部分*/
.menu ul ul {
visibility:hidden;/*隐藏所有子菜单（二级的,三级的）*/
position:absolute;
left:0px;
top:32px;
}
/*指定是显示二级子菜单*/
.menu ul li:hover ul.second,/*非IE6*/
.menu ul a:hover ul.second{/*IE6*/
visibility:visible;
}
.menu ul ul li {
clear:both;/*垂直显示*/
text-align:left;
}
.menu .third,.menu .fourth,.menu .fifth,.menu .sixth{
top:0px;/*重设子菜单相对于包含块哪个位置出现*/
left:100px;
}
/*指定是显示三级子菜单*/
.menu ul ul li:hover ul.third,
.menu ul ul a:hover ul.third{
visibility:visible;
}
/*指定是显示四级子菜单*/
.menu ul ul ul li:hover ul.fourth,
.menu ul ul ul a:hover ul.fourth{
visibility:visible;
}
/*指定是显示五级子菜单*/
.menu ul ul ul ul li:hover ul.fifth,
.menu ul ul ul ul a:hover ul.fifth{
visibility:visible;
}
/*指定是显示六级子菜单*/
.menu ul ul ul ul ul li:hover ul.sixth,
.menu ul ul ul ul ul a:hover ul.sixth{
visibility:visible;
}
/*重设子菜单在鼠标滑过时的样式，有多少个ul就表明当前是多少级子菜单*/
/*二级子菜单*/
.menu ul ul a:hover{
background:black;
color:white;
}
/*三级子菜单*/
.menu ul ul ul a:hover{
background:#B45B3E;
color:#369;
}
.menu ul ul ul ul a:hover{
background:#FFE8AA;
color:#68DFFB;
}
.menu ul ul ul ul ul a:hover{
background:#8080C0;
color:#F8F8F8;
}
.menu ul ul ul ul ul ul a:hover{
background:#f00;
color:#000;
}
.menu table{
border-collapse:collapse;
}
- 6级菜单
- 6菜单
- 导航菜单下拉列表 2级菜单
- 树形图菜单级多级菜单显示
- 级连菜单
- 关联菜单.四级
- 五级菜单
- 无限级树形菜单
- 无限级树形菜单
- 无限级菜单
- 无限级树形菜单
- 联级菜单
- 四级下拉菜单
- 无限级树形菜单
- jQuery 无限级菜单
- 无限级树形菜单
- 联级下来菜单
- 无限级菜单
- 国庆回家，每个人都问我...
- 保险该不该买（2009.10-3 周六 第一财经理财宝典）
- android develop
- Java中关于String需要明确的几个知识点
- 什么是ARP
- 6级菜单
- 提高应用程序的性能----全局应用程序缓存
- 2个简单排序算法的java实现
- zoj 1745
- 开站测试
- ubuntu8.10上网设置
- Setting Environment Variables in Mac OSX
- 分析函数over 及开窗函数
- Detecting HTTP Load Balancers using Halberd
