纯CSS下拉菜单菜单

清华大佬耗费三个月吐血整理的几百G的资源,免费分享!....>>>

<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 .l,.item ul .l{border-bottom:0}
		</style>
	</head>
	<body>
		<ul class="menu">
			<li class="item">
				<ul>
					<li class="f">文件</li>
					<li>打开</li>
					<li>关闭</li>
					<li>保存</li>
					<li>另存为</li>
					<li>打印</li>
					<li class="l">退出</li>
				</ul>	
			</li>
			<li class="item">
				<ul>
					<li class="f">编辑</li>
					<li>撤销</li>
					<li>重做</li>
					<li>复制</li>
					<li>粘贴</li>
					<li>剪切</li>
					<li class="l">全选</li>
				</ul>	
			</li>
			<li class="item">
				<ul>
					<li class="f">帮助</li>
					<li>帮助文档</li>
					<li class="l">关于</li>
				</ul>	
			</li>
		</ul>
	</body>
</html>