CSS怎樣實(shí)現(xiàn)導(dǎo)航效果

這篇文章主要介紹CSS怎樣實(shí)現(xiàn)導(dǎo)航效果，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

html

<div <ul>

<li><a href=”#” name=”topurl”>首頁(yè)</a></li>

<li><a href=”#” name=”topurl”>手機(jī)</a></li>

<li><a href=”#” name=”topurl”>女人</a></li>

<li><a href=”#” name=”topurl”>數(shù)碼家電</a></li>

<li><a href=”#” name=”topurl”>居家</a></li>

<li><a href=”#” name=”topurl”>讀書(shū)</a></li>

</ul>

<script language=”javascript”>

function showmenu(){

var url = document.URL;

var urls = document.getElementsByName(“topurl”);

for(var i=0;i<urls.length;i++){

if(urls[i] == url){

urls[i].parentNode.className = &lsquo;navselect&rsquo;;

return;

}

}

urls[0].parentNode.className = &lsquo;navselect&rsquo;;

}

showmenu();

</script>

</div>

css

.navdefault{float:left;text-align:center;color:#fff;letter-spacing:1px;font-size:12px;}

.navselect {float:left;text-align:center;font-weight:bolder;color:#FFF;background:url(../images/head01/head_17.gif) no-repeat bottom;font-size:14px;}

以上是“CSS怎樣實(shí)現(xiàn)導(dǎo)航效果”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！