<html>
<head>
<style>
body{font-family:arial;}
table{font-size:80%;background:black}
a{color:black;text-decoration:none;font:bold}
a:hover{color:#606060}
td.menu{background:lightblue}
table.menu
{
font-size:100%;
position:absolute;
visibility:hidden;
}
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.getElementById(elmnt).style.visibility="visible"
}
function hidemenu(elmnt)
{
document.getElementById(elmnt).style.visibility="hidden"
}
</script>
</head>
<body>
<h3>下拉菜单</h3>
<table width="100%">
<tr bgcolor="#FF8080">
<td onmouseover="showmenu('tutorials')" onmouseout="hidemenu('tutorials')">
<a href="/static/demo/images/eg_landscape.jpg">教程</a><br />
<table class="menu" id="tutorials" width="120">
<tr><td class="menu"><a href="/html/index.html">HTML</a></td></tr>
<tr><td class="menu"><a href="/xhtml/index.asp">XHTML</a></td></tr>
<tr><td class="menu"><a href="/css/index.html">CSS</a></td></tr>
<tr><td class="menu"><a href="/xml/index.asp">XML</a></td></tr>
<tr><td class="menu"><a href="/xsl/index.asp">XSL</a></td></tr>
</table>
</td>
<td onmouseover="showmenu('scripting')" onmouseout="hidemenu('scripting')">
<a href="/static/demo/images/eg_landscape.jpg">脚本</a><br />
<table class="menu" id="scripting" width="120">
<tr><td class="menu"><a href="/javascript/index.html">JavaScript</a></td></tr>
<tr><td class="menu"><a href="/vbscript/index.asp">VBScript</a></td></tr>
<tr><td class="menu"><a href="/dhtml/index.asp">DHTML</a></td></tr>
<tr><td class="menu"><a href="/asp/index.asp">ASP</a></td></tr>
<tr><td class="menu"><a href="/ado/index.asp">ADO</a></td></tr>
</table>
</td>
<td onmouseover="showmenu('validation')" onmouseout="hidemenu('validation')">
<a href="/site/site_validate.asp">验证</a><br />
<table class="menu" id="validation" width="120">
<tr><td class="menu"><a href="/site/site_validate.asp">验证 HTML</a></td></tr>
<tr><td class="menu"><a href="/site/site_validate.asp">验证 XHTML</a></td></tr>
<tr><td class="menu"><a href="/site/site_validate.asp">验证 CSS</a></td></tr>
<tr><td class="menu"><a href="/site/site_validate.asp">验证 XML</a></td></tr>
<tr><td class="menu"><a href="/site/site_validate.asp">验证 WML</a></td></tr>
</table>
</td>
</tr>
</table>
<p>把鼠标移动到不同的选项上，就可以看到下拉菜单。</p>
</body>
</html>
