|
|
這是我剛剛作的一個(gè)導(dǎo)航條，為了讓那四個(gè)LINK居中，我這樣作了，但作完后發(fā)現(xiàn)了很多的問(wèn)題，寫出來(lái)和大家分享一下！
首先我們先來(lái)看一下這個(gè)導(dǎo)航條！
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
問(wèn)題：
1、空格BUG出現(xiàn)我FIREFOX中，不知道為什么，如果把LI分不寫在同一行，問(wèn)題就出來(lái)了，你可以在上邊運(yùn)行代碼中試一下！
2、IE和FIREFOX的微小區(qū)別（看下圖），如果你沒(méi)有發(fā)現(xiàn)這小小的區(qū)別，你就不會(huì)在CSS中寫成padding:6px 15px 5px 15px; 也就永遠(yuǎn)不會(huì)把中間的豎線和上下兩條線連在一起?。ㄟ@其中IE6和IE7還有更微小的區(qū)別）；
3、#nav li a{margin:1px;}這行是不是沒(méi)有用？如果你這樣認(rèn)為你就刪了試一下，看行不行！
4、頁(yè)面在縮放到一定小時(shí)會(huì)折行，F(xiàn)IREFOX中用min-width解決，而IE中min-width不認(rèn)識(shí)，所以只有用：expression((documentElement.clientWidt.....來(lái)解決了！我在上邊的代碼中沒(méi)有加，如果你不想折行就把上邊#nav這行改成：
程序代碼 復(fù)制代碼 代碼如下:
#nav{height:24px; border-bottom:1px solid #D28A05; border-top:1px solid #D28A05;background-image: url(nav_bg.jpg);background-color: #FF9900; text-align:center;min-width:400px;width: expression((documentElement.clientWidth < 400) ? "400px" : "auto" );}
基本就這行多問(wèn)題，建議自已作一下，這樣你會(huì)發(fā)現(xiàn)特別多的問(wèn)題！
另外：這篇BLOG會(huì)在FIREFOX中很難看，你就湊合看吧！
再另外：我寫的難免有問(wèn)題，如果真有，你就指出來(lái)，我會(huì)非常高興的！
HTML/CSS技術(shù)：一個(gè)自動(dòng)居中的導(dǎo)航條實(shí)例與相關(guān)問(wèn)題 DIV+CSS，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
