CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)圖片鏈接_菜單導(dǎo)航特效

CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)鏈接，是一個(gè)圖片導(dǎo)航，在早期的DW中有專(zhuān)一制作本效果的插件，不過(guò)隨著大家CSS水平的提高，現(xiàn)在做出這種效果好像得心應(yīng)手了，因?yàn)檫@種果大家應(yīng)該都挺喜歡的。

<html>
<head>
<title>CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)鏈接</title>
<style>
@charset "utf-8";
body {
text-align:center;
font-size:12px;
color:#777777;
font-family:Verdana, Arial, Verdana, sans-serif,"宋體";
background-color:#FFFFFF;
margin:0;
padding:0;
}
#Nav {
margin:0;
float:left;
padding:5px 5px;
text-align:center;
width:280px;
border:1px solid #777777;
}

#Nav ul {
margin:0;
padding:0;
list-style-type:none;
}

#Nav li {
float:left;
margin:0;
width:130px;
height:33px;
margin-left:5px;
padding:0;
}

#Nav a {
display:block;
width:130px;
height:33px;
line-height:33px;
}

#Nav a.Dict:link,#Nav a.Dict:visited {
text-decoration:none;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left top no-repeat;
}

#Nav a.Dict:hover,#Nav a.Dict:active {
text-decoration:none;
font-weight:bold;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left -33px no-repeat;
}

#Nav a.MediaPlay:link,#Nav a.MediaPlay:visited {
text-decoration:none;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left -66px no-repeat;
}

#Nav a.MediaPlay:hover,#Nav a.MediaPlay:active {
text-decoration:none;
font-weight:bold;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left -99px no-repeat;
}

#Nav a.RealPlay:link,#Nav a.RealPlay:visited {
text-decoration:none;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left -132px no-repeat;
}

#Nav a.RealPlay:hover,#Nav a.RealPlay:active {
text-decoration:none;
font-weight:bold;
background:url(http://p1.mb5u.com/texiao/1/nav.gif) left -165px no-repeat;
}
</style>
</head>
<body>

<center>
<div id="Nav">
	<ul>
		<li><a class="Dict" href="#">詞霸</a></li>
		<li><a class="MediaPlay" href="#">MediaPlay</a></li>
		<li><a class="RealPlay" href="#">RealPlay</a></li>
		<li><a class="CodeFans" href="#">MediaPlay</a></li>
		<li><a class="RealPlay" href="#">RealPlay</a></li>
	</ul>
</div>
</center>
</body>
</html>

所屬頻道：菜單導(dǎo)航特效/更新時(shí)間：2011-02-24

[收藏][報(bào)錯(cuò)][返回列表]

相關(guān)菜單導(dǎo)航特效：

菜單導(dǎo)航特效Rss訂閱特效代碼搜索

菜單導(dǎo)航特效推薦

猜你也喜歡看這些

相關(guān)鏈接：
復(fù)制本頁(yè)鏈接| 搜索CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)圖片鏈接
特效說(shuō)明：
菜單導(dǎo)航模板-CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)圖片鏈接。

日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

CSS偽類(lèi)實(shí)現(xiàn)的鼠標(biāo)滑動(dòng)圖片鏈接_菜單導(dǎo)航特效

菜單導(dǎo)航特效Rss訂閱特效代碼搜索

菜單導(dǎo)航特效推薦

猜你也喜歡看這些