用css实现的一张图完成的导航条 ----为中国网络技术提供点滴动力-iyit.net-易特网络技术！

　　通行证: 用户密码

域名空间　下载中心　 社区论坛　信息公告 my小屋

联系我们
设为首页
加入收藏

qq,asp,php,jsp,xml,sql,.net,编程程序网页图象建站经验私服




	当前位置：首页>>网页设计>>html/css>>正文	新版上线！[旧版]

注:打开慢时请稍等

用css实现的一张图完成的导航条

http://www.iyit.net 日期：2006-9-1 15:21:16 来源：点击：

【参加讨论】

<!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" content="text/html; charset=gb2312" />
<title>网页特效代码|jscode.cn|---用css实现的一张图完成的导航条</title>
<style>
ul,li{ list-style:none; float:left;}
body{ font-size:12px; line-height:1.6; font-family:verdana, "宋体", arial; text-align:center;}
#info li{ margin-left:4px; margin-top:15px;}
#info a {display:block;text-align:center; padding-left:15px;
padding-top:2px;padding-bottom:1px;background-image:
url(http://www.jscode.cn/uploadfile/200682494749491.gif);
background-repeat: no-repeat;color: #000; width:47px; cursor:hand; text-decoration: none;}
#job a:link,#job a:visited{background-position: -62px 0px;}
#eve a:link,#eve a:visited{background-position: -124px 0px;}
#oth a:link,#oth a:visited{background-position: -186px 0px;}
#car a:hover ,#car a:active {background-position: 0px -22px; color:#fff;}
#job a:hover ,#car a:active {background-position: -62px -22px; color:#fff;}
#eve a:hover ,#car a:active {background-position: -124px -22px; color:#fff;}
#oth a:hover ,#car a:active {background-position: -186px -22px; color:#fff;}
</style>
</head>

<body>
<div id="info">
<ul>
<li id="car"><a href="http://www.iyit.net" target="_blank"><span>
游戏</span></a></li>
<li id="job"><a href="http://www.iyit.net" target="_blank"><span>
娱乐</span></a></li>
<li id="eve"><a href="http://www.iyit.net" target="_blank"><span>
菜单</span></a></li>
<li id="oth"><a href="http://www.iyit.net" target="_blank"><span>
好玩</span></a></li>
</ul>
</div>
<div style="clear:both">转载请注明出处子鼠 <a href="http://www.zishu.cn" target="_blank">
http://www.zishu.cn</a> 作者：子鼠</div>
</body>
</html>

编辑：　[发送给好友] [打印本页] [关闭窗口] [返回顶部]
上一篇：用css控制透明图片
下一篇：没有了
转载请注明来源：www.iyit.net
特别声明： 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员，我们尽快予以更正。

		相关文章

推荐新闻

解密.htm.html.shtm.shtml的区别与联系

捍卫19寸lcd地位优派vg1921wm 售价 :

海尔抢发酷睿2机型新旧产品区隔明显

盛维显卡 sw5200 geforce6200 联拓奉上

盛维6500显卡 128m 64bit 售价：320元

在asp.net中保存/取出图片入/从sql数据

qq2006 beta3隆重发布实用功能一一奉

win powershell遭遇病毒最好升级软件

siteadvisor 助你远离恶意网站

提升流量站长应该做的五件事

	友情链接

	copyrights ? 2004-2006 iyit.net all rights reserved. 网站合作、广告联系qq:147007642、466949678
	易特网络技术冀icp备05011851号		浏览器不支持嵌入式框架，或被配置为不显示嵌入式框架。