先看效果：
[img]http://files.jb51.net/file_images/article/201311/201311221703382.gif?2013102217424[/img]
代码：
<html>
<head>
<title>Good Test</title>
<script>
function showSubMenu(SubMenu) {
document.getElementById(SubMenu).style.display = "inline";
}
function HideSubMenu(SubMenu) {
document.getElementById(SubMenu).style.display = "none";
}
</script>
<style>
.menu{
margin:1px 1px 1px 1px;
padding:3px 5px 3px 5px;
background-color:#8080C0;
color:white;
}
.submenu {
margin:1px 1px 1px 1px;
padding:3px 5px 3px 5px;
background-color:#8080C0;
color:white;
}
</style>
</head>
<body>
<div>
<table>
<tr>
<td style="vertical-align:top;">
<span class="menu" id="Menu1" onmousemove="showSubMenu('SubMenu1')" onmouseout="HideSubMenu('SubMenu1')" >Menu1</span>
<br />
<div id="SubMenu1" style="display:none" onmousemove="showSubMenu('SubMenu1')" onmouseout="HideSubMenu('SubMenu1')">
<span class="submenu">SubMenu1</span><br />
<span class="submenu">SubMenu2</span><br />
<span class="submenu">SubMenu3</span><br />
<span class="submenu">SubMenu4</span>
</div>
</td>
<td style="vertical-align:top;">
<span class="menu" id="Menu2" onmousemove="showSubMenu('SubMenu2')" onmouseout="HideSubMenu('SubMenu2')">Menu2</span>
<br />
<div id="SubMenu2" style="display:none" onmousemove="showSubMenu('SubMenu2')" onmouseout="HideSubMenu('SubMenu2')">
<span class="submenu">SubMenu1</span><br />
<span class="submenu">SubMenu2</span><br />
<span class="submenu">SubMenu3</span><br />
<span class="submenu">SubMenu4</span>
</div>
</td>
<td style="vertical-align:top;">
<span class="menu" id="Menu3" onmousemove="showSubMenu('SubMenu3')" onmouseout="HideSubMenu('SubMenu3')">Menu3</span>
<br />
<div id="SubMenu3" style="display:none" onmousemove="showSubMenu('SubMenu3')" onmouseout="HideSubMenu('SubMenu3')">
<span class="submenu">SubMenu1</span><br />
<span class="submenu">SubMenu2</span><br />
<span class="submenu">SubMenu3</span><br />
<span class="submenu">SubMenu4</span>
</div>
</td>
<td style="vertical-align:top;">
<span class="menu" id="Menu4" onmousemove="showSubMenu('SubMenu4')" onmouseout="HideSubMenu('SubMenu4')">Menu4</span>
<br />
<div id="SubMenu4" style="display:none" onmousemove="showSubMenu('SubMenu4')" onmouseout="HideSubMenu('SubMenu4')">
<span class="submenu">SubMenu1</span><br />
<span class="submenu">SubMenu2</span><br />
<span class="submenu">SubMenu3</span><br />
<span class="submenu">SubMenu4</span>
</div>
</td>
</tr>
</table>
</div>
</body>
</html>
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码（独立后台）...
