http://www.imooc.com/video/155
MU lesson net video, directly on the code
<!DOCTYPE HMTL><HTML> <Head> <MetaCharSet= "Utf-8" /> <title> </title> <styletype= "Text/css"> * {margin:0px;padding:0px; }#nav{Background-color:#eee;width:600px;Height:40px;margin:0 Auto;text-align:Center; }ul{List-style:None}ul Li{float: Left;Line-height:40px;text-align:Center;position:relative;}a{text-decoration:None;Display:Block;padding:0 10px; }a:hover{Color:#fff;Background-color:#666; } /*when the mouse slides over the UL Li, the current UL Li ul display*/UL Li:hover ul{Display:Block; }ul Li ul Li{float:None;Background-color:#eee;Margin-top:2px; }UL Li ul{ /*absolute positioning must be what left,top and so on combination use, top:40px, is because of its father Li Lineheight is 40px;*/position:Absolute; Left:0px;Top:40px;Display:None; } </style> </Hean> <Body> <DivID= "NAV"> <ul> <Li><ahref="#">Home</a></Li> <Li><ahref="#">Course Hall</a> <ul> <Li><ahref="#">Javascript</a></Li> <Li><ahref="#">Jquery</a></Li> </ul> </Li> <Li><ahref="#">Learning Center</a></Li> <Li><ahref="#">Classic case</a> <ul> <Li><ahref="#">Bbs</a></Li> <Li><ahref="#">Newssystemnewssystem</a></Li> </ul> </Li> <Li><ahref="#">About Us</a></Li> </ul> </Div> </Body> </HTML>
JavaScript Basics Exercises-dropdown box Authoring (CSS)