<Meta name = "author" content = "Ma Jia Nan"> <meta name = "date" content = "2008-12-7"> <meta name = "Description" content = ""> <br/> <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 first level menu which displays default */# menubar. menumain {border-color: # c0c0c0; border-width: 1px; border-style: solid;}/* The first leve style when mouse on it */# menubar Li: hover {background-color: # efefef; text-Decoration: underline;}/* The second level menu block style */# menubar Li ul {background-color: # efef; 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 {display: none; position: absolute; top: 0px; left: 150px; margin-top: 0; margin-left: 0; width: 150px ;}</style> <p> <ul id = "menubar"> <li onmouseover = "displaysubmenu (this) "onmouseout =" hidesubmenu (this) "> file </P> <ul> <li> New </LI> <li> open </LI> <li> Save As </LI> <li> close </LI> </ul> </LI> <li onmouseover = "displaysubmenu (this) "onmouseout =" hidesubmenu (this) "> edit </P> <ul> <li> cut </LI> <li> copy </LI> <li> paset </LI> <li> Delete </ LI> <li> select all </LI> </ul> </LI> <li onmouseover = "displaysubmenu (this) "onmouseout =" hidesubmenu (this) "> View </P> <ul> <li onmouseover =" displaysubmenu (this) "onmouseout =" hidesubmenu (this) "> View list </P> <ul> <li> tool bar </LI> <li> state bar </LI> <li> function list </LI> <li> label list </LI> </ul> </LI> <li> show line number </LI> <li> set color </LI> </ul> </ LI> </ul> <p>