二级菜单源代码

<style type="text/css">
		#menu{/*菜单块样式*/	
		width:280px;	
		float: left;
		line-height: 30px;/*行高*/		
		padding:20px 0px;<br />		}	
#menu li{/*菜单块中所有菜单样式*/
		background: url(images/p.png) no-repeat left;/*不平铺*/	
		list-style-type: none;		
		border: 1px dotted #656565;			
		box-shadow: 0 1px #fff;/*阴影*/		}
#menu li a{/*菜单超级链接样式*/
		text-decoration: none;/*去下划线*/
		padding-left: 20px;
		color: #656565;		
		display: block;
		}
#menu li a:hover{/*超级链接悬停样式*/
		color: #363636;
		background-color: #ccc;
		background-image:url(images/p.png);
		background-repeat: no-repeat;
		background-position: left;
		}
.sub_menu{/*二级菜单块样式*/
		width: 220px;
		padding-bottom: 10px;
		position: absolute;
		left: 248px;
		top:100px;
		display: none;
		}
.sub_menu li a{/*耳机菜单超级链接样式*/
		line-height: 30px;
		text-align: center;<br />		}
#menu li:hover .sub_menu{/*悬停显示二级菜单样式*/
	display: block;<br />		}
</style>

<div id="menu">
<h2 align="center">景点类型</h2>
<ul>
 	<li><a href="#">沙滩</a>
<ul id="sub_menu" class="sub_menu">
 	<li><a href="#">亚龙湾</a></li>
 	<li><a href="#">海棠湾</a></li>
 	<li><a href="#">大亚湾</a></li>
</ul>
</li>
 	<li><a href="#">水上项目</a></li>
 	<li><a href="#">岛屿</a></li>
 	<li><a href="#">游乐场</a></li>
 	<li><a href="#">高尔夫</a></li>
</ul>
</div>

可下载此网页观看及修改：