CSS仿迅雷视频首页导航条(蓝色)_菜单导航特效

这个导航条做的不错，是模仿迅雷视频网站的，完全基于CSS和HTML代码，大气清新，请运行一下看看效果如何。

<!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>
<meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" />
<title>仿迅雷网站导航</title>
<style type="text/css">
body{margin:0px;font-size:13px; font-family:Verdana, Arial, Helvetica, sans-serif}
#nav{position:relative;width:964px;height:95px;z-index:1px;margin:10px auto; background:url(http://p1.mb5u.com/texiao/1/kkindex_nav.png)}
#navli{position:absolute;width:580px;height:32px;left:35px;top:-2px;}
ul {margin:0;}
.dh li{width:72px;height:30px; float:left;position:relative; line-height:30px;zoom:1;list-style:none;text-align:center; background:url(http://p1.mb5u.com/texiao/1/kkindex_nav.png) no-repeat; background-position:-125px -99px}
.dh li a{color:#000000; text-decoration:none}
.dh li a:hover{zoom:1;color:#ffffff;text-decoration:none; font-weight:bold; background:url(http://p1.mb5u.com/texiao/1/kkindex_nav.png) no-repeat 0 -95px; width:72px; height:30px;}
.dhhome{background:url(http://p1.mb5u.com/texiao/1/kkindex_nav.png) no-repeat 0 -95px;width:72px;height:30px;zoom:1;color:#ffffff !important; font-weight:bold}
.dhright{position:absolute;width:280px;height:31px;left:680px;top:-2px; text-align:center; line-height:30px;}
.dhrightimg{ position:absolute;right:-4px; top:10px;background:url(http://p1.mb5u.com/texiao/1/kkindex_nav.png) no-repeat; background-position:-954px -115px; padding-right:15px; width:10px;height:10px;}
</style>
</head>

所属频道：菜单导航特效/更新时间：2011-02-24

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

CSS仿迅雷视频首页导航条(蓝色)_菜单导航特效

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

菜单导航特效推荐

猜你也喜欢看这些