纯CSS下拉菜单
<html>
<head>
<style type="text/css">
ul{padding:0}
.item{width:100px;padding:0 5px;border:solid 1px #eee;display:block;float:left}
.item ul li{width:100px;padding:6px 0;text-align:center;display:none;cursor:default}
.item ul .f,.item:hover ul li{display:block}
.item ul li:hover{background:#f0f0f0}
.item:hover ul li{border-bottom:solid 1px #eee;}
.item:hover ul li a{color:Red;}
.item:hover ul .l,.item ul .l{border-bottom:0}
</style>
</head>
<body>
<ul class="menu">
<li class="item">
<ul>
<li class="f"><a href="About.aspx" title="打开">文件</a></li>
<li><a href="About.aspx" title="打开">打开</a></li>
<li><a href="About.aspx" title="打开">关闭</a></li>
<li><a href="About.aspx" title="打开">保存</a></li>
<li><a href="About.aspx" title="打开">另存为</a></li>
<li><a href="About.aspx" title="打开">打印</a></li>
<li class="l"><a href="About.aspx" title="打开">退出</a></li>
</ul>
</li>
<li class="item">
<ul>
<li class="f"><a href="About.aspx" title="打开">编辑</a></li>
<li><a href="About.aspx" title="打开">撤销</a></li>
<li><a href="About.aspx" title="打开">重做</a></li>
<li><a href="About.aspx" title="打开">复制</a></li>
<li><a href="About.aspx" title="打开">粘贴</a></li>
<li><a href="About.aspx" title="打开">剪切</a></li>
<li class="l"><a href="About.aspx" title="打开">全选</a></li>
</ul>
</li>
<li class="item">
<ul>
<li class="f">帮助</li>
<li>帮助文档</li>
<li class="l">关于</li>
</ul>
</li>
</ul>
</body>
</html>
