<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title>下拉菜單2-1，JS</title>
<style>
*?{
padding:?0;
margin:?0;
}??
#nav?{
background-color:?#eee;
width:?600px;
height:?40px;
margin:?0?auto;
}
ul?{
list-style:?none;?
}
ul?li?{
float:?left;
line-height:?40px;
text-align:?center;
}
a?{
text-decoration:?none;
color:?#000;
display:?block;?
padding:?0?20px;
}
a:hover?{
color:?#fff;
background-color:?#666;
}
ul?li?ul?li?{
float:?none;
background-color:?#eee;
margin-top:?2px;
}
ul?li?ul?{
position:?absolute;????
display:?none;
}
</style>
<script?type="javascript">
function?showsubmenu(){
var?submenu=li.getElementsByTagName("ul")[0];
submenu.style.display="block";
}
function?hidesubmenu(){
var?submenu=li.getElementsByTagName("ul")[0];
submenu.style.display="none";
}
</script>
</head>
<body>
<div?id="nav">
<ul>
<li><a?href="#">首頁</a></li>
<li?onmouseover="showsubmenu()"?onmouseout="hidesubmenu()"><a?href="#">課程大廳</a>
<ul>
<li><a?href="">javascript</a></li>
<li><a?href="">jQuery</a></li>
</ul>
</li>
<li><a?href="#">學習中心</a>
<ul>
<li><a?href="">視頻學習</a></li>
<li><a?href="">案例學習</a></li>
<li><a?href="">交流平臺</a></li>
</ul>
</li>
<li><a?href="#">經典案例</a></li>
<li><a?href="#">關于我們</a></li>
</ul>
</div>
</body>
</html>
為什么二級菜單無法顯示？
umenoki
2016-11-03 13:10:25