CSS+HTML的问题,如何修改代码,使下面网址中的<table>下拉菜单边框与主菜...
发布网友
发布时间：2024-09-17 06:32
共1个回答
热心网友
时间：2024-09-29 05:27
<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 style="padding:0;" onmouseover="showmenu('tutorials')" onmouseout="hidemenu('tutorials')">
<a href="/i/eg_landscape.jpg">教程</a><br />
<table class="menu" id="tutorials" width="120" cellpadding="0" cellspacing="0">
<tr><td class="menu"><a href="/html/index.asp">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.asp">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 style="padding:0;" onmouseover="showmenu('scripting')" onmouseout="hidemenu('scripting')">
<a href="/i/eg_landscape.jpg">脚本</a><br />
<table class="menu" id="scripting" width="120" cellpadding="0" cellspacing="0">
<tr><td class="menu"><a href="/js/index.asp">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 style="padding:0;" onmouseover="showmenu('validation')" onmouseout="hidemenu('validation')">
<a href="/site/site_validate.asp">验证</a><br />
<table class="menu" id="validation" width="120" cellpadding="0" cellspacing="0">
<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>
