<ptml> <pead> <meta name= "Author" content= "Ma Jia Nan" > <meta name= "Date" content= "2008-12-7" > <meta name= "Description" content= "" > <title>Menu</title> <style type= ' text/css ' > #menubar Font-family:verdana; font-size:12px; margin:1px; } #menubar li {float:left; position:relative; Text-align:left; /* Each menu item style */#menubar li a {border-style:none; Color:black; Display:block; width:150px; height:20px; line-height:20px; padding-left:10px; Text-decoration:none; }/* the ' the ' the ' Level ' menu which displays default */#menubar. menumain{border-color: #C0C0C0; border-width:1px; Border-style:solid; }/* The leve style when mouse on it/#menubar Li a:hover{background-color: #efefef; Text-decoration:underline; }/* The second Level menu block style */#menubar li ul{background-color: #efefef; Border-style:none; Display:none; Position:absolute; top:20px; left:-40px; margin-top:2px;width:150px; }/* The Sub menu item style when mouse on it * * #menubar Li ul li a:hover {text-decoration:underline; padding-left:20px; }/* The third or more level menu block style */#menubar Li ul li ul Display:none; Position:absolute; top:0px; left:150px; margin-top:0; margin-left:0; width:150px; } </style> <script language= ' JavaScript ' > function Displaysubmenu (li) {var submenu = Li.getelementsbytagn Ame (' ul ') [0]; SubMenu.style.display = ' block '; function Hidesubmenu (li) {var submenu = li.getelementsbytagname (' ul ') [0]; SubMenu.style.display = ' None '; } </script> </pead> <body> <div> <ul id= ' menubar ' > <li onmouseover= ' Displaysubmenu ( This] "onmouseout=" Hidesubmenu (this) > File <ul> <li>New</li> <li>Open</li> <li& Gt save</li> <li>save as</li> <li>Close</li> </ul> </li> <li onmouseover= "D Isplaysubmenu (This) "OnmouseOut= "Hidesubmenu (This)" > Edit <ul> <li>Cut</li> <li>Copy</li> <li>paset</ li> <li>Delete</li> <li>select all</li> </ul> </li> <li onmouseover= "Displa Ysubmenu (This) "onmouseout=" Hidesubmenu [This] > View <ul> <li onmouseover= "Displaysubmenu (This)" Onmouseout= "Hidesubmenu (This)" > View List <ul> <li>tool bar</li> <li>state bar</li> <li>function list</li> <li>label list</li> </ul> </li> <li>show line Number& lt;/li> <li>set color</li> </ul> </li> </ul> </div> </body> </ptml& Gt
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
