天天看點
傳回

一個簡單的下拉菜單

先看圖：

一個簡單的下拉菜單
<!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>
  • ​​​​
  • 大小: 4.8 KB
  • ​​檢視圖檔附件​​
html xml 3c
上一篇: 使用STM32G030進行IAP遠端更新
下一篇: STM32的代碼更新-IAP---未完待續

繼續閱讀