firefox的超鏈接點擊去除擴大的難看虛線的解決方法
更新時間：2008年12月03日 16:26:51 作者：
在Firefox里，鼠標(biāo)點擊一個鏈接時，它的周圍即出現(xiàn)虛線畫出的邊框。這種例子遍地都是，在WordPress后臺寫這個文章的時候，隨手點一下右邊那些widget，就看到了這個問題（圖片的右上角）
在某些特殊的情況下，比如做一個導(dǎo)航菜單的時候，出現(xiàn)這個情況時效果就很糟糕了，因為Firefox會錯誤地擴大鏈接的邊框：
在Firefox的地址欄輸入about:config，回車。有一個配置項叫做“browser.display.focus_ring_width”，把它修改成0，點擊鏈接時就不會出現(xiàn)那個邊框。但這樣的話，在焦點落在按鈕上時也沒有了邊框指示。而且作為一個開發(fā)者，在瀏覽器里設(shè)置這個屬性，無異于掩耳盜鈴。
這實際上是Firefox在<a>這個標(biāo)簽處于focus狀態(tài)時（pseudo selector - a:focus）給它加的outline屬性。
正確的解決辦法是在CSS里加一個規(guī)則：
a {
outline: none;
}
或者縮小范圍：
a:focus {
outline: none;
}
后者使得鼠標(biāo)左鍵在鏈接上按下，松開之前的這段時間里，仍會顯示虛線的outline.
在我看到的大部分網(wǎng)站中，都把這條規(guī)則寫在CSS里。或許Firefox該考慮去掉這個的默認outline.
在Firefox的地址欄輸入about:config，回車。有一個配置項叫做“browser.display.focus_ring_width”，把它修改成0，點擊鏈接時就不會出現(xiàn)那個邊框。但這樣的話，在焦點落在按鈕上時也沒有了邊框指示。而且作為一個開發(fā)者，在瀏覽器里設(shè)置這個屬性，無異于掩耳盜鈴。
這實際上是Firefox在<a>這個標(biāo)簽處于focus狀態(tài)時（pseudo selector - a:focus）給它加的outline屬性。
正確的解決辦法是在CSS里加一個規(guī)則：
a {
outline: none;
}
或者縮小范圍：
a:focus {
outline: none;
}
后者使得鼠標(biāo)左鍵在鏈接上按下，松開之前的這段時間里，仍會顯示虛線的outline.
在我看到的大部分網(wǎng)站中，都把這條規(guī)則寫在CSS里。或許Firefox該考慮去掉這個的默認outline.
相關(guān)文章
為方便站點哀悼，特提供素裝代碼，以表哀悼。以下為全站CSS代碼。2008-05-05
今天遇到一個神奇的問題：下面是代碼 代碼在IE7中正常顯示，IE6什么也不顯示。2008-05-05
巧妙的最大化動態(tài)載入IFrame的方法...2007-03-03
門戶網(wǎng)站構(gòu)建CSS框架的規(guī)則
對于大型門戶，海量信息平臺及多模塊，多區(qū)域化網(wǎng)站，更需要對CSS，XHTML，的標(biāo)準(zhǔn)化，符合語意的HTML框架，復(fù)用性強的CSS代碼，這些才能保障你的網(wǎng)站，具有很好的“地基”。2008-09-09
div結(jié)合css布局bbs首頁(div+css布局入門)
最近趁離職，我在做一個論壇系統(tǒng)，練練手，需要一個論壇首頁的html頁面，深知自己美工極差，心里很苦啊。于是買了本div+css網(wǎng)站布局的書，沒想到講得還不錯，感覺長進很快，于是磨拳擦掌非要自己寫一個不可，高手末笑。代碼伺候。2008-11-11
兼容Compatible and tested with IE6, IE7, Safari 2, Safari 3, Firefox 2, Opera 9.21的圖片垂直居中效果代碼2008-05-05
一個頁面有4個Iframe來顯示flash內(nèi)容，其中第二個iframe的顯示是用Javascript控制的，只有當(dāng)特定的cookie存在時才出現(xiàn)，否則顯示普通的文本。2008-05-05
今天訪問好多網(wǎng)站包括百度，啟點等網(wǎng)站都變成了黑白色界面，體現(xiàn)大家對于四川地震的深切哀悼，但有好的站長不一定知道是什么方法，還以為是大量改版，對于任何人都不是很輕松的事，特將本站的解決方法告訴大家。2008-05-05
解決IE7以下版本不支持無A狀態(tài)偽類的幾種方法...2007-01-01
最近看到一個詞叫css reset。什么叫做css reset呢？我理解為重置css，也就是重置默認樣式。2008-11-11