怎么實現(xiàn)下面的不會移位,能夠正常顯示?當鼠標經(jīng)過顯示出隱藏的內(nèi)容后面的排版怎么全部亂了?怎么實現(xiàn)的必影響后面的內(nèi)容排版?
<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html?xmlns="http://www.w3.org/1999/xhtml">
<head>
????<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
????<title>無標題文檔</title>
????<style?type="text/css">
????????*{?margin:0px;?padding:0px;}
????????body{?font-family:Verdana,?Geneva,?sans-serif;?font-size:14px;}
????????#nav{?width:600px;?height:40px;?background-color:#eee;?margin:0?auto;}
????????ul{?list-style:none;}
????????ul?li{?float:left;?line-height:40px;?text-align:center;?width:100px;}
????????a{?text-decoration:none;?color:#000;?display:block;}
????????a:hover{?color:#F00;?background-color:#666;}
????????ul?li?ul?li{?float:none;background-color:#eee;?margin:2px?0px;}
????????ul?li?ul{display:none;}
????</style>
????<script?type="text/javascript">
????????function?showsub(li)?{
????????????var?subMenu?=?li.getElementsByTagName("ul")[0]??;
????????????subMenu.style.display?=?"?block?";
????????}
?
????????function?hidesub(li)?{
????????????var?subMenu?=?li.getElementsByTagName("ul")[0];
????????????subMenu.style.display?=?"?none?";
????????}
?
????</script>
</head>
?
<body>
<div?id="nav">
????<ul>
????????<li><a?href="#">首頁</a></li>
????????<li??onmouseover="showsub(this)"?onmouseout="hidesub(this)"??><a?href="#">課程大廳</a>
????????????<ul>
????????????????<li><a?href="#">JavaScript</a></li>
????????????????<li><a?href="#">Html/CSS</a></li>
????????????</ul>
????????</li>
????????<li??onmouseover="showsub(this)"?onmouseout="hidesub(this)"><a?href="#">學習中心</a>
????????????<ul>
????????????????<li><a?href="#">視頻學習</a></li>
????????????????<li><a?href="#">實例練習</a></li>
????????????????<li><a?href="#">問與答</a></li>
????????????</ul>
?
????????</li>
????????<li><a?href="#">經(jīng)典案例</a></li>
????????<li><a?href="#">關(guān)于我們</a></li>
????</ul>
????<div?id="nav">
????????<ul>
????????????<li><a?href="#">首頁</a></li>
????????????<li??onmouseover="showsub(this)"?onmouseout="hidesub(this)"??><a?href="#">課程大廳</a>
????????????????<ul>
????????????????????<li><a?href="#">JavaScript</a></li>
????????????????????<li><a?href="#">Html/CSS</a></li>
????????????????</ul>
????????????</li>
????????????<li??onmouseover="showsub(this)"?onmouseout="hidesub(this)"><a?href="#">學習中心</a>
????????????????<ul>
????????????????????<li><a?href="#">視頻學習</a></li>
????????????????????<li><a?href="#">實例練習</a></li>
????????????????????<li><a?href="#">問與答</a></li>
????????????????</ul>
?
????????????</li>
????????????<li><a?href="#">經(jīng)典案例</a></li>
????????????<li><a?href="#">關(guān)于我們</a></li>
????????</ul>
????</div>
</body>
</html>
2016-02-18
你id為“nav“的div沒有寫閉合標簽,其次你寫了兩個id為"nav"的div,顯然是不合規(guī)矩的,一個id只能對應(yīng)一個元素。