如今，在公司的一般管理背景下，使用左右框架结构。点击左侧和右侧展开内容。在项目中，经常会遇到左二三级。之前使用过dtree，但是发现dtree在风格和结构上很难控制。如果是动态数据，要写入cs文件输入字符，不利于维护。时间久了就找不到了。所以今天，我写了一个轻量级的三级扩展菜单。如果需要，我可以再加一级。一般公司三级项目就够了。简介：div不需要定义自己的类和ID，只要有以下结构即可。数据可以是动态的，也可以是静态的，可以自己控制，修改符合自己的风格。

代码如下：css复制代码如下： style type=' text/CSS ' * { margin 33600 px；padding:0px} a { text-decoration : none；color: # 000} a:hover，a:linked { color: # 000} # nav { margin-left :20 px；list-style : none；} #nav li，#nav li ul，# nav Li ul Li { list-style : none；} #nav阿利{ width:200px高度：30 px；线高：30 px；背景# ccc显示：块；text-indent :10 px；} #nav li ul阿利{ background: # eaeaea} #nav li ul li ul阿利{ background: # fffff2} /style js:复制代码如下： script type=' text/JavaScript '//作者：乐福网//网站：www.cnblogs.com/clc2008 $(function(){ $(' # navul ')。hide()；//控制第一级子菜单$ ('# navli a: first-child ')。单击(function () {$ (this))。兄弟姐妹()。toggle()；});//控制辅助子菜单$ ('# navli ul a: first-child ')。单击(function () {$ (this))。兄弟姐妹()。查找(' ul ')。toggle()；});});/script div:复制代码如下： body ul id='nav' lia href='# '主页管理/a ul lia href='# '主页标题1/a ul lia href='#'_主页标题1_1/a /li lia href='#'_主页标题1 _ 2/a/Li/ul。Li lia href='# '主标题2/a/li lia href='# '主标题3/a/li /ul /li lia href='# '产品管理/a ul lia href='# '产品标题1/a/li lia href='# '产品标题2/a/li lia href='# '。