代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>无标题页</title> <link rel="Stylesheet" href="../css/main.css" mce_href="css/main.css" type="text/css" /> <asp:ContentPlaceHolder ID="head" runat="server"> </asp:ContentPlaceHolder> <mce:script language="JavaScript" type="text/JavaScript"><!-- function change_view(obj_name) { var aa=document.getElementById(obj_name); if(aa.style.display=="") { aa.style.display="none"; } else { aa.style.display=""; } } // --></mce:script> </head> <body> <form id="form1" runat="server"> <div id="b_head"> <span>网站后台管理</span> </div> <div id="b_left"> <div id="dh">导航栏</div> <div id="menuleft" class="leftmenucontainer"> <ul> <li><a href="#" mce_href="#">首页</a></li> <li> <ul ><li onClick="change_view('a1')"><a href="#" mce_href="#">电影管理</a></li></ul> <div id="leftmenu2"> <ul id="a1" style="display:none" mce_style="display:none"> <li><a href="#" mce_href="#">修改电影信息</a></li> <li><a href="#" mce_href="#">上传电影</a></li> <li><a href="#" mce_href="#">电影类型管理</a></li> </ul> </div> </li> <li><a href="#" mce_href="#">用户管理</a></li> <li><a href="#" mce_href="#">评论管理</a></li> <li><a href="#" mce_href="#">修改管理员</a></li> <li><a href="#" mce_href="#">添加管理员</a></li> <li><a href="#" mce_href="#">注销</a></li> </ul> </div> </div> <div id="b_right"> <span>浏览信息</span> </div> </form> </body> </html> 对应css样式: /*后台css*/ #b_head { width:auto; height:50px; font-size:30px; line-height:50px; color:Navy; background-color:Orange; vertical-align:middle; padding:10px 5px; } #b_left { width: 200px; height: auto; float: left; } #b_left #dh { background-color:Orange; margin:5px 0px 5px 0px; width:200px; height:25px; line-height:25px; height:auto; font-size:16px; text-align:center; } .leftmenucontainer { font-size:18px ; height:auto; line-height:25px; color:#505050; margin: 5px 0 5px 0px; padding :5px 0 5px 0px; } .leftmenucontainer li a:link,.leftmenucontainer li a:visited { color: #505050; display: block; text-decoration: none; } #menuleft li a:hover,#menuleft li a:active { color: #013676; background-color:#ccc; text-decoration: none; border-left:2px orange solid; border-right:2px orange solid; } #menuleft li a { padding-left:20px; } /*这是二级菜单的style*/ #leftmenu2 { float:inherit; width: 200px; height:auto; font-size:16px; border-width: 1px; } #leftmenu2 li a { height: auto; text-decoration: none; padding: 3px 0 0 40px; }