Tip: you can modify some code before running
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><ptml><pead><title>Two-level drop-down menu for website background management</title><meta http-equiv="content-type" content="text/html;charset=gb2312"><!--把下面代码加到<pead>与</pead>之间--><style type="text/css">* {Margin: 0px; padding: 0px;} body {width: 160px; font-size: 12px; text-align: left; line-height: 20px; background: #799AE1;} div # nifty {margin: 0 42%; background: # D6DFF7;} B. rtop, B. rbottom {display: block; background: # 799ADD;} B. rtop B, B. rbottom B {display: block; height: 1px; overflow: hidden; background: # D6DFF7;} B. r1 {margin: 0 5px;} B. r2 {margin: 0 3px;} B. r3 {margin: 0 2px;} B. rtop B. r4, B. rbottom B. r4 {margin: 0 1px; height: 2px;} a {color: #333333; text-decoration: none;} a: hover {color: #000000; text-decoration: underline;} image {border: 0px;} h2 {font-size: 14px; font-weight: bold; text-align: left; padding: 3px 5px; color: # fff; background: # 799ADD;} ul {background: # F1F3F5;} li {list-style: none; text-align: left ;}. menu, # left_top {width: 160px; padding: 1px; margin-top: 5px ;}. menu h2 {width: 158px; background: # BFDEFD; cursor: hand; color: #333; font-weight: normal; background: url (http://www.111cn.netimages/201008230800/h2_bg.gif); line-height: 23px; padding: 1px 5px ;}. menu ul {background: # D6DFF7; border: 1px # fff solid; display: none ;}. menu h2 span {padding-top: 3px ;}. menu li {width: 148px; padding-top: 1px; padding-left: 15px; background: url () no-repeat 5px 8px ;}. menu a {width: 100% ;}. menu a: hover {text-decoration: none; background: # C7F1F1;} # left_top h2 {width: 158px; background: url (http://www.111cn.netimages/201008230800/title.gif); line-height: 30px ;} # left_top ul {background: url (http://www.111cn.netimages/201008230800/quit_bg.gif); line-height: 23px;} # left_top li {width: 148px; padding: 1px 3px; font-weight: bold ;} # left_top. pwd {float: left; width: 70px; padding: 2px 2px 2px 2px;} # left_top. quit {float: left; width: 70px; padding: 2px 2px 2px ;}</style><script language="javascript">Function switchMenu (divTitle, obj) {if (obj. style. display = "block") {obj. style. display = "none"; divTitle. innerHTML = "";} else {obj. style. display = "block"; divTitle. innerHTML = "";}}</script></pead><body><!--把下面代码加到<body>与</body>之间--><div id="nifty"><b class="rtop"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b></b><div id="left_top"><p> </p><ul><li>Function List</li></ul></div><div class="menu"><p onClick="switchMenu(SiteTitle,SiteMenu)">Water fee management</p><ul id="SiteMenu"><li>Project 1</li><li>Project 2</li><li>Project 3</li><li>Project 4</li></ul></div><div class="menu"><p onClick="switchMenu(MemberCTitle,MemberCMenu)">Electricity cost management</p><ul id="MemberCMenu"><li>Project 1</li><li>Project 2</li><li>Project 3</li><li>Project 4</li></ul></div><div class="menu"><p onClick="switchMenu(copyrightTitle,copyright)">Copyright information</p><ul id="copyright" ><li>Development: Ruicheng Studio</li><li>QQ: 151290938</li></ul></div><b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b></div></body></ptml>
Tip: you can modify some code before running