DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> CSS制作的背景動態變化的網頁導航
CSS制作的背景動態變化的網頁導航
編輯:CSS詳解     

自己寫的個導航,感覺還不錯...惟一的不足就是hack比較多,如果有簡潔的方式實現,請留言告訴我...呵呵...

樣式部分:

#headerMenu {
    width:560px;
    margin:30px auto;
}
.menu {
    font-size:14px;
    line-height:18px;
    *line-height:32px;
}
.menu li {
    display:inline;
}
.menu a:link,
.menu a:visited{
    display:-moz-inline-stack;/*FF下有效*/
    *display:inline;/*此行及下行為IE定義*/
    zoom:1;
    width:80px;
    padding:8px 0px 6px 0px;
    *padding:0;
    float:left;
    color:#014A99;
    text-align:center;
    text-decoration:none;
    background:url(/files/081222/1_164717.gif);
}
.menu a:hover{
    color:#FFF;
    font-weight:bold;
    background:url(/School/UploadFiles_7810/201105/20110526111705404.gif);
}
.home{
    background:url(/School/UploadFiles_7810/201105/20110526111705404.gif)!important;
    color:#FFF !important;
    font-weight:bold;
}

運行查看效果:


 [Ctrl+A 全部選擇 提示:你可先修改部分代碼,再按運行]

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved