CSS垂直菜单

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

#ddblueblockmenu{
border: 1px solid black;
border-bottom-width: 0;
width: 180px;
}

#ddblueblockmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font: normal 90% ’Trebuchet MS’, ’Lucida Grande’, Arial, sans-serif;
}

#ddblueblockmenu li a{
    display: block;
    padding: 3px 0;
    padding-left: 9px;
    width: 180px; /*185px minus all left/right paddings and margins*/
    text-decoration: none;
    color: white;
    background-color: #2175bc;
    border-bottom: 1px solid #90bade;
    border-left: 7px solid #1958b7;
    font-size: 12px;
}

* html #ddblueblockmenu li a{ /*IE only */
width: 180px; /*IE 5*/
w\idth: 180px; /*185px minus all left/right paddings and margins*/
}

#ddblueblockmenu li a:hover {
background-color: #2586d7;
border-left-color: #1c64d1;
}

#ddblueblockmenu div.menutitle{
    color: white;
    border-bottom: 1px solid black;
    padding: 5px;
    background-color: black;
    font-size: 14px;
    font-weight: bold;
    width: 180px;
}

</style>
<div id="ddblueblockmenu">

<div class="menutitle">IDTcn.com</div>
<ul>
<li><a href="http://www.idtcn.com/">深圳IDT设计室</a></li>  
<li><a href="http://seo.idtcn.com/">搜索优化(SEO)</a></li>  
<li><a href="http://food.sz95555.com/">家常菜(Food)</a></li>  
<li><a href="http://idc.idtcn.com/">数据中心(IDC)</a></li>  
<li><a href="http://library.idtcn.com/">网站重构(CSS/Script)</a></li>  
</ul>

<div class="menutitle">ASP技术中文网</div>
<ul>
<li><A href="http://www.szasp.cn/HTML/30/31/">ASP/ASP.NET专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/33/">JSP专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/32/">PHP专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/35">XML专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/38">AJAX 专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/46/">CGI专区</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/37/">网页教程</A></li> 
<li><A href="http://www.szasp.cn/HTML/30/36/">脚本编程</A></li> 
<li style="border-bottom:1px #000000 solid"><A href="http://www.szasp.cn/HTML/30/34/">Python专区</A></li>
</ul>

</div>
<br><br>----<br><br><a href="http://library.idtcn.com" _fcksavedurl="http://library.idtcn.com" target="_blank">更多效果请访问http://library.idtcn.com</a>