简洁蓝色的折叠菜单，适于网站后台左侧使用

　　一个简洁、蓝色风格的折叠菜单，一眼看上去就很适于网站后台管理菜单，尤其适用于左侧使用，比较熟悉CMS的朋友都明白，例如：DEDECMS、科汛CMS等都是这样的折叠、收缩式管理菜单，如果你喜欢就拿去用吧！

　　示例代码：

<html> <head> <title>简洁蓝色的折叠菜单，适于网站后台左侧使用 - www.Liehuo.Org</title> </head> <style type="text/css">  </style> <style type="text/css"> .menu_title SPAN { FONT-WEIGHT: bold; LEFT: 3px; COLOR: #ffffff; POSITION: relative; TOP: 2px } .menu_title2 SPAN { FONT-WEIGHT: bold; LEFT: 3px; COLOR: #FFCC00; POSITION: relative; TOP: 2px } </style> <script> var he=document.body.clientHeight-105 document.write("<div id=tt style=height:"+he+";overflow:hidden>") </script> <body> <table width="165" height="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="28" background="/uploads/allimg/1108/main_40.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="19%"> </td> <td width="81%" height="20"><span class="STYLE1">管理菜单</span></td> </tr> </table></td> </tr> <tr> <td valign="top"><table width="151" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="23" background="/uploads/allimg/1108/main_47.gif" id="imgmenu1" class="menu_title" onMouseOver="this.className='menu_title2';" onClick="showsubmenu(1)" onMouseOut="this.className='menu_title';" style="cursor:hand"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="18%"> </td> <td width="82%" class="STYLE1">业务中心</td> </tr> </table></td> </tr> <tr> <td background="/uploads/allimg/1108/main_51.gif" id="submenu1"> <div class="sec_menu" > <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="16%" height="25"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td width="84%" height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">短信群发</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">用户资料修改</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">公司信息管理</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">其他业务</span></td> </tr> </table></td> </tr> </table></td> </tr> <tr> <td height="5"><img src="/uploads/allimg/1108/main_52.gif" width="151" height="5" /></td> </tr> </table></div></td> </tr> </table></td> </tr> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="23" background="/uploads/allimg/1108/main_47.gif" id="imgmenu2" class="menu_title" onmouseover="this.className='menu_title2';" onclick="showsubmenu(2)" onmouseout="this.className='menu_title';" style="cursor:hand"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="18%"> </td> <td width="82%" class="STYLE1">系统管理</td> </tr> </table></td> </tr> <tr> <td background="/uploads/allimg/1108/main_51.gif" id="submenu2"><div class="sec_menu" > <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="16%" height="25"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td width="84%" height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">系统配置</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">修改用户密码</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">数据更新</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">网站维护</span></td> </tr> </table></td> </tr> </table></td> </tr> <tr> <td height="5"><img src="/uploads/allimg/1108/main_52.gif" width="151" height="5" /></td> </tr> </table> </div></td> </tr> </table> </td> </tr> <tr> <td><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="23" background="/uploads/allimg/1108/main_47.gif" id="imgmenu3" class="menu_title" onmouseover="this.className='menu_title2';" onclick="showsubmenu(3)" onmouseout="this.className='menu_title';" style="cursor:hand"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="18%"> </td> <td width="82%" class="STYLE1">安全管理</td> </tr> </table></td> </tr> <tr> <td background="/uploads/allimg/1108/main_51.gif" id="submenu3" style="DISPLAY: none"><div class="sec_menu" > <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="16%" height="25"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td width="84%" height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">企业安全</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">信息安全管理</span></td> </tr> </table></td> </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">安全审计</span></td> </tr> </table></td>  </tr> <tr> <td height="23"><div align="center"><img src="/uploads/allimg/1108/left.gif" width="10" height="10" /></div></td> <td height="23"><table width="95%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20" style="cursor:hand" onmouseover="this.style.borderStyle='solid';this.style.borderWidth='1';borderColor='#7bc4d3'; "onmouseout="this.style.borderStyle='none'"><span class="STYLE3">网站安全</span></td> </tr> </table></td> </tr> </table></td> </tr> <tr> <td height="5"><img src="/uploads/allimg/1108/main_52.gif" width="151" height="5" /></td> </tr> </table> </div></td> </tr> </table></td> </tr> </table></td> </tr> </table> </body> </html> <script> function showsubmenu(sid) { whichEl = eval("submenu" + sid); imgmenu = eval("imgmenu" + sid); if (whichEl.style.display == "none") { eval("submenu" + sid + ".style.display=\"\";"); imgmenu.background="/uploads/allimg/1108/main_47.gif"; } else { eval("submenu" + sid + ".style.display=\"none\";"); imgmenu.background="/uploads/allimg/1108/main_48.gif"; } } </script> <br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!