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

簡單明了的CSS導(dǎo)航條_菜單導(dǎo)航特效

簡單明了的CSS導(dǎo)航條，適合風(fēng)格比較簡潔的網(wǎng)頁，導(dǎo)航條盡量不要搞太復(fù)雜，最重要的功能是導(dǎo)航，華而不實的東西有時候會令人反感不是嗎?本導(dǎo)航條純CSS實現(xiàn)，而且兼容性也不錯，學(xué)習(xí)CSS的朋友可以繼續(xù)完善它。

<html>
<head>
<meta http-equiv="Content-Type" mrc="text/html; charset=gb2312" />
<title>CSS導(dǎo)航條</title>
<style type="text/css">
<!--
#navcontainer
{
margin: 0;
padding: 0;
font: 12px Verdana, sans-serif;
width: 100%;
border-bottom: 1px solid #bbb;
list-style-type: none;
}

#navlist li
{
float: left;
width: auto;
display: block;
}

#navlist li a, #navlist li a:link
{
color: #555;
text-decoration: none;
padding: 3px 5px 3px 5px;
display: block;
}

#navlist li a:hover
{
color: #039;
border-bottom: 3px solid #bbb;
cursor: pointer;
background: #eee;
}

#navlist li a#current, #navlist li a#current:link
{
color: #000;
cursor: default;
font-weight: bold;
border-bottom: 3px solid #999;
}

#navlist li a#current:hover
{
border-bottom: 3px solid #f90;
background: #eee;
}

-->
</style>
</head>

所屬頻道：菜單導(dǎo)航特效/更新時間：2012-10-30

[收藏][報錯][返回列表]

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

簡單明了的CSS導(dǎo)航條_菜單導(dǎo)航特效

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

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

猜你也喜歡看這些