abstrak：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <h
<!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;}
#nav{ width:600px; height:40px; margin:0 auto;}
#nav ul{ list-style:none;}
#nav ul li{ float:left; line-height:40px; text-align:center; position:relative;}
#nav ul li a{ text-decoration:none; color:#000; display:block;padding:0px 10px;}
#nav ul li a:hover{ color:#FFF; background:#333}
#nav ul li ul{ position:absolute; display:none;}
#nav ul li ul li{ float:none; line-height:30px; text-align:left;}
#nav ul li ul li a{ width:100%;}
#nav ul li ul li a:hover{ background-color:#06f;}
#nav ul li:hover ul{ display:block}
</style>
</head>
<div id="nav">
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">學(xué)習(xí)中心</a>
<ul>
<li><a href="#">java</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">C++</a></li>
<li><a href="#">C語言</a></li>
</ul>
</li>
<li><a href="#">個人中心</a></li>
<li><a href="#">關(guān)于我們</a></li>
</ul>
</div>
<body>
</body>
</html>理解：display：block；這個很重要，當(dāng)鼠標(biāo)一上去的時候顯示，平常是隱藏作態(tài)，下拉菜單功能簡單，但是比較常用，主要是要理解他的工作原理，時機(jī)應(yīng)用中就會比較順手!
Guru membetulkan：查無此人Masa pembetulan：2019-05-09 14:15:00
Rumusan guru：完成的不錯。等你學(xué)習(xí)js后，會發(fā)現(xiàn)display更重要，繼續(xù)加油