網(wǎng)頁特效代碼模板無憂>網(wǎng)頁特效>菜單導(dǎo)航特效代碼>

藍(lán)色清新菜單，和圖片配合的很完美_菜單導(dǎo)航特效

經(jīng)典的藍(lán)色清新菜單，和背景圖片配合的幾乎完美，豎向排列視覺效果比較舒服，鼠標(biāo)滑過菜單的時(shí)候，背景色和菜單顏色形成鮮明對比，有種綻放強(qiáng)烈的感覺。

<title>藍(lán)色清新菜單</title>
<style>
body {
margin:0;
padding:0;
font:70% Arial, Helvetica, sans-serif; 
color:#555;
text-align:center;
line-height:180%;}
a{
color:#000;
text-decoration:none;}
#container{
margin:0 auto;
width:575px;
text-align:left;
padding-top:20px;}
ul#nav, ul#nav li{
margin:0;
padding:0;
list-style:none;}
ul#nav{
background:url(http://p1.mb5u.com/texiao/0/2010052223053471.jpg) no-repeat 100% 0;
height:214px;}
ul#nav li{
width:190px;
margin-top:1px;}
ul#nav li.first{
margin:0;}
ul#nav li a{
display:block;
width:100%;	
background:#bae2f0 url(/jscss/demoimg/200907/arrow1.gif) no-repeat 10px 50%;
color:#0e85b0;	
line-height:42px;	
text-indent:25px;}
ul#nav li a:hover{
color:#fff;
background:#0e85b0 url(http://www.wf0088.com/jscss/demoimg/200907/arrow2.gif) no-repeat 10px 50%;}
</style>
<div id="container"> 
<ul id="nav">
<li><a href="/">模板無憂</a></li>
<li><a href="http://www.wf0088.com">網(wǎng)頁殊效</a></li>
<li><a href="/">源代碼</a></li>
<li><a href="/">最新更新</a></li>
<li><a href="/">下載排行</a></li>
</ul>
</div>

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

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

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

藍(lán)色清新菜單，和圖片配合的很完美_菜單導(dǎo)航特效

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

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

猜你也喜歡看這些