請保留超鏈接的outline屬性
發(fā)布時(shí)間：2010-03-15 19:03:19 作者：佚名 
我要評論
我要評論默認(rèn)情況下，用戶點(diǎn)擊某個(gè)鏈接后，這個(gè)鏈接的周圍會有一圈虛線來標(biāo)識。很多Web設(shè)計(jì)師不喜歡這個(gè)虛線，通常都會用CSS來去掉。
outline: none
或者
outline: 0
這樣做的直接后果是，那些習(xí)慣使用鍵盤的用戶將無法獲知他們用Tab鍵當(dāng)前定位在哪個(gè)鏈接。所以永遠(yuǎn)不要移除鏈接的outline，除非你有其他更好的方法來標(biāo)識鍵盤的focus事件。
還有的設(shè)計(jì)師直接用JavaScript的onfocus事件來移除鏈接的focus，這將徹底使鍵盤用戶無法使用這個(gè)網(wǎng)頁，除非他們用鼠標(biāo):)
所以，請保留鏈接的outline。
或者
outline: 0
這樣做的直接后果是，那些習(xí)慣使用鍵盤的用戶將無法獲知他們用Tab鍵當(dāng)前定位在哪個(gè)鏈接。所以永遠(yuǎn)不要移除鏈接的outline，除非你有其他更好的方法來標(biāo)識鍵盤的focus事件。
還有的設(shè)計(jì)師直接用JavaScript的onfocus事件來移除鏈接的focus，這將徹底使鍵盤用戶無法使用這個(gè)網(wǎng)頁，除非他們用鼠標(biāo):)
所以，請保留鏈接的outline。
相關(guān)文章
使用CSS的border屬性構(gòu)建變形邊框的方法總結(jié)
border是最常用的用來制作各種各樣div邊框的CSS屬性,這里我們整理了使用CSS的border屬性構(gòu)建變形邊框的方法總結(jié),最主要的還是基于三角形的一些圖形變換:2016-06-23- 用CSS3的border-radius屬性來制作圓角邊框相當(dāng)順手,然而瀏覽器的兼容問題并不是太好處理,這里我們就來總結(jié)一下border-radius以外的CSS圓角邊框制作方法.2016-06-02
實(shí)例講解CSS3中的border-radius屬性
這篇文章主要介紹了實(shí)例講解CSS3中的border-radius屬性,是CSS3入門學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下2015-08-18- 這篇文章主要介紹了詳解CSS3中border-image的使用,是CSS3入門學(xué)習(xí)中的基礎(chǔ)知識,需要的朋友可以參考下2015-07-18
- 這篇文章主要介紹了CSS3使用border-radius屬性制作圓角，并附上示例代碼，推薦給有相同需求的小伙伴。2014-12-22
使用CSS實(shí)現(xiàn)outline切換的動畫效果
這篇文章主要介紹了使用CSS實(shí)現(xiàn)outline切換的動畫效果,作者展示了一個(gè)應(yīng)用于注冊框中的方框自動切換位置的例子,需要的朋友可以參考下2015-06-24去掉點(diǎn)擊鏈接時(shí)周圍的虛線框outline屬性
以下是解決方案： 方法一： 在IE下是使用html屬性：hideFoucs，在HTML標(biāo)簽中加上hidefocus=”true” 屬性即可，但這個(gè)屬性是IE私有的，F(xiàn)irefox是不認(rèn)的。 &2009-06-19CSS教程:text-indent隱藏文字出現(xiàn)虛線框outline-CSS教程-網(wǎng)頁制作-網(wǎng)頁
鏈接用圖片做背景，text-indent:-9999px; 隱藏文字，此效果在 IE 中是正常的，但在 Firefox 里，鼠標(biāo)點(diǎn)擊該鏈接時(shí)，虛線框卻會包住被縮進(jìn)的文字，結(jié)果顯示為虛線框 N2008-10-17- 這篇文章主要介紹了深入淺析border和outline區(qū)別的相關(guān)資料,需要的朋友可以參考下2016-07-04