HTML5实例之javaScript制作水平下拉菜单

html5实例之javascript制作水平下拉菜单

*{padding:0px;} 
p{margin:20px 150px;} 
ul{list-style:none;} 
ul li{float:left;position:relative;} 
ul li a{text-decoration:none; 
background:#900; 
height:40px; 
display:block; 
color:#fff; 
font-weight:bold; 
line-height:40px; 
text-align:center; 
margin-right:1px; 
padding:0px 15px; 
} 
ul li a:hover{background:#f90;} 
ul li ul li{float:none;} 
ul li ul{position:absolute;top:41px;left:0px; 
display:none; 
}

function showmenu(li){ var submenu=li.getelementsbytagname("ul")[0]; submenu.style.display="block"; } function hidemenu(op){ var submenu=op.getelementsbytagname("ul")[0]; submenu.style.display="none"; }