欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-03-09 22:17:51
html5实例之javascript制作水平下拉菜单 *{padding:0px;} p{margin:20px 150px;} ul{list-style:none;} ul l...

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"; }