黑色竖排的CSS导航菜单_菜单导航特效

玄色竖排的CSS导航菜单，就不是看到很多网站首页的左侧或右侧有一个漂亮的垂直菜单？实在实现方法非常简单，实现的方法和横向的基本一样，只是这里没有float:left定义，这样菜单默认就是竖向排列了？是不是恍然大悟？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>源码下载 - 模板无忧</title>
<style type="text/css">
/**/*/
#coolmenu{
border: 1px solid black;
border-bottom-width: 0;
width: 170px;
background-color: #E6E6E6;
}

* html #coolmenu{ /*IE only rule*/
width: 164px;
}

#coolmenu a{
font: bold 13px Verdana;
padding: 2px;
padding-left: 4px;
display: block;
width: 100%;
color: black;
text-decoration: none;
border-bottom: 1px solid black;
}

html>body #coolmenu a{ /*Non IE rule*/
width: auto;
}

#coolmenu a:hover{
background-color: black;
color: white;
}

</style>
</head> 
<body>

<div id="coolmenu">
<a href="/">模板无忧</a>
<a href="/sort/list_1_1.shtml">ASP</a>
<a href="/sort/list_2_1.shtml">PHP</a>
<a href="/sort/list_3_1.shtml">.NET</a>
<a href="/sort/list_13_1.shtml">C#</a>
<a href="/sort/list_4_1.shtml">JSP</a>
<a href="/sort/list_5_1.shtml">Java</a>
<a href="/sort/list_8_1.shtml">VC/C++</a>
<a href="/sort/list_9_1.shtml">VB</a>
<a href="/sort/list_10_1.shtml">Delphi</a>
<a href="/sort/list_11_203_1.shtml">Ajax</a>
<a href="/sort/list_11_1.shtml">脚本资源</a>
<a href="/sort/list_11_112_1.shtml">jQuery</a>
<a href="/sort/list_7_1.shtml">电子书籍</a>
<a href="/sort/list_6_1.shtml">工具软件</a>
</div>
</body>
</html>

所属频道：菜单导航特效/更新时间：2010-05-22

[收藏][报错][返回列表]

黑色竖排的CSS导航菜单_菜单导航特效

菜单导航特效Rss订阅特效代码搜索

菜单导航特效推荐

猜你也喜欢看这些