先看图：



一个简单的下拉菜单_html




<!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><title></title> 

<style type="text/css"> 

dl { 

 float:left; 

 margin:0 1px 0 0; 

 padding:0px; 

 width:150px; 

 background:#dff; 

} 

dl dt{ 

 text-align:left; 

 background:#ddf; 

} 

dl dd{ 

 text-align:left; 

 background:#daf; 

 display:none; 

} 



dl:hover dd{ 

 display:block; 

} 

</style> 

</head> 

<body> 

<ul> 

 <dl> 

 <dt><a href="#">beijing1</a></dt> 

 <dd><a href="#">chaoyang1</a></dd> 

 <dd><a href="#">fengtai1</a></dd> 

 <dd><a href="#">mentougou1</a></dd> 

 </dl> 


 <dl> 

 <dt><a href="#">beijing2</a></dt> 

 <dd><a href="#">qinghua</a></dd> 

 <dd><a href="#">beida</a></dd> 

 <dd><a href="#">beiyou</a></dd> 

 </dl> 


 <dl> 

 <dt><a href="#">beijing3</a></dt> 

 </dl> 


 <dl> 

 <dt><a href="#">beijing4</a></dt> 

 </dl> 

</ul> 

</body> 

</html>


  • ​​

    一个简单的下拉菜单_xml_02

    ​    ​
  • 大小: 4.8 KB
  • ​​查看图片附件​​