close
文章出處
<!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;} .yiji{width:100px; height:36px; text-align:center; line-height:36px; vertical-align:middle; float:left;} .yiji:hover{ background-color:#F09; color:#FFF;;} </style> </head> <body> <div style="width:500px; height:36px; border:1px solid #60F; margin:0px auto;"> <div class="yiji" onmouseover="xianshi('erji1')" onmouseout="yincang('erji1')" >首頁</div> <div id="erji1" style=" float:left; width:0px; display:none;"> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">首頁1</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">首頁2</div> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px; background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">首頁3</div> </div> <div class="yiji" onmouseover="xianshi('erji2')" onmouseout="yincang('erji2')">產品中心</div> <div id="erji2" style=" float:left; width:0px; display:none;"> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">產品中心1</div> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">產品中心2</div> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">產品中心3</div> </div> <div class="yiji" onmouseover="xianshi('erji3')" onmouseout="yincang('erji3')">活動中心</div> <div id="erji3" style=" float:left; width:0px; display:none;"> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">活動中心1</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">活動中心2</div> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px;background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">活動中心3</div> </div> <div class="yiji" onmouseover="xianshi('erji4')" onmouseout="yincang('erji4')">聯系我們</div> <div id="erji4" style=" float:left; width:0px; display:none;"> <div style="width:100px; height:36px; position:relative; top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">聯系我們1</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">聯系我們2</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px;background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">聯系我們3</div> </div> <div class="yiji" onmouseover="xianshi('erji5')" onmouseout="yincang('erji5')">郵箱</div> <div id="erji5" style=" float:left; width:0px; display:none;" > <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">郵箱1</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C; text-align:center; line-height:36px; vertical-align:middle;">郵箱2</div> <div style="width:100px; height:36px; position:relative;top:38px; left:-100.5px; background-color:#06C;text-align:center; line-height:36px; vertical-align:middle;">郵箱3</div> </div> </div> </body> <script type="text/javascript"> function xianshi(d) { var erji=document.getElementById(d); erji.style.display="block"; } function yincang(d) { var erji=document.getElementById(d); erji.style.display="none"; } </script> </html>
鼠標放上會拉伸，鼠標拿走會收起來
 |
不含病毒。www.avast.com |
全站熱搜
留言列表
