導(dǎo)航條代碼特效（可以自定義顏色）

2009-11-23 導(dǎo)航菜單 ℃

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> THE BEAUTIFUL LIST </TITLE>
<style type="text/css">
div#BeautifulList{width:300px;margin:20px;font-family: Verdana;}
#BeautifulList a{display:block;color:#BBE1E7;padding:10px 15px;background-color:#3DA2B6;border-bottom:dotted 1px #A8D3DA;font-size:12px;text-decoration:none;}
#BeautifulList a:hover{color:#fff;background-color:#58AFC0; font-weight:bold; }
#BeautifulList h1{margin:0;font-weight:normal;color:#fff;padding:15px;font-size:14px;background-color:#238298}
#BeautifulFoot h2{color:white;margin:0; font-size:14px;padding:20px 10px;}
/*圓角*/
div.RoundedCorner{background: #3DA2B6}
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px;overflow: hidden; background: #3DA2B6}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}
</style>
</HEAD>
<BODY>
<div   class="ec2wlf2"   id="BeautifulList">
<h1>THE BEAUTIFUL LIST</h1>
<a href="#">Home</a>
<a href="#">Blog</a>
<a href="#">Photos</a>
<a href="#">About</a>
<a href="#">Contact Me</a>
<div   class="egsdtgs"   id="BeautifulFoot" class="RoundedCorner">

<h2>Welcome to PureDays.CN</h2>
<b class="rbottom"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b></b>
</div>
</div>
</BODY>
</HTML></font>

相關(guān)特效代碼

熱門特效代碼: 三級豎向展開/收縮導(dǎo)航菜單; 鼠標指向彈出菜單; jQuery 彈出菜單層; CSS二級下拉導(dǎo)航菜單; CSS做的垂直導(dǎo)航菜單效果; 橫向二級導(dǎo)航菜單; 仿google首頁下端圖片文字動畫導(dǎo); 導(dǎo)航鏈接菜單間隔閃爍; 動態(tài)翻滾的導(dǎo)航條[酷比flash]; 純CSS的三級聯(lián)動級聯(lián)菜單

推薦特效代碼: CSS+div+js組合強大實現(xiàn)超酷菜單; 動態(tài)翻滾的導(dǎo)航條[酷比flash]; CSS橫向下拉菜單; 微軟風(fēng)格的CSS橫向菜單; 立體的CSS按鈕菜單效果; 左側(cè)隱藏的菜單