在前端制作的過程中會發(fā)現(xiàn)，一些文字/圖片鏈接，或者一些input控件，在點擊時會在周圍出現(xiàn)虛線邊框。

這些虛線邊框是作為對視覺設(shè)計的一種輔助，在不使用鼠標，而用鍵盤Tab鍵進行頁面瀏覽時，會標示出當前所在的鏈接或控件的位置，便于瀏覽。這對那些視覺有障礙的人士來說更是必不可少的。

10年積累的成都網(wǎng)站制作、成都網(wǎng)站建設(shè)經(jīng)驗，可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認識你，你也不認識我。但先網(wǎng)站設(shè)計制作后付款的網(wǎng)站建設(shè)流程，更有平定免費網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。

但是有些時候我們卻不想使用它們，因為瀏覽器對虛線框的解析有差異，并且不規(guī)則，所以在視覺設(shè)計上反而成為了某種缺陷。所以這種時候，我們想要禁用這些虛線邊框，使瀏覽者的視覺享受能夠完美無瑕。

那么，如何去除這些點擊時才會出現(xiàn)的虛線邊框呢？

卻倒也是蠻復(fù)雜的，且逐一分析一番。

1. outline:none;
通常我們會這么寫：

1 a:focus, input[type=button] ,input[type=submit] {
2     outline:none;
3 }

優(yōu)點是代碼簡潔，使用一行css就能解決問題，但是也有缺點：ie6、ie7并不認識outline屬性。

2. hidefocus=”true”;
hidefocus是ie系列的專有屬性，能夠作用于所有ie序列的瀏覽器。
也可以寫作：hidefocus=”hidefocus”;
另外，hidefocus并不是W3C推薦的標準屬性。
缺點是非全局控制，需要在每個需要去虛線邊框的鏈接或input上加代碼。

3. onfocus=”this.blur()”;
優(yōu)點是比較通用。
缺點也很多，首先同2一樣，也是屬于局部控制的手段，需要在每一個需要去虛線邊框的標簽上使用；
然后這是屬于script范疇，對于禁用JavaScript的用戶來說不起作用；
將script直接寫在html中對于頁面效率有負面作用。
該方法需要與border:none;配合使用。

4. :active{outline:none;}
與1大致相同，唯一的區(qū)別是會在Tab鍵切換時出現(xiàn)虛線邊框。

5. ::-moz-focus-inner{outline:none;}
Firefox的專有屬性，在去除input的虛線邊框時需要使用到此屬性。
但是經(jīng)測試，應(yīng)該對select無作用。

6. 使用JS遍歷每一個鏈接

1 window.onload=function()
2 {
3 for(var ii=0; i<document.links.length; ii++)
4 document.links$[$ii$]$.onfocus=function(){this.blur()}
5 }

也可以封裝起來作為函數(shù)：

1 function fHideFocus(tName){
2     aTag=document.getElementsByTagName(tName);
3   for(i=0;i<aTag.length;i++)aTag$[$i$]$.hideFocus=true;
4   //for(i=0;i<aTag.length;i++)aTag$[$i$]$.onfocus=function(){this.blur();};5 }

當前是添加一個hidefocus的屬性，注釋掉的句子是添加onfucus=this.blur();
然后調(diào)用fHideFocus(“A”)，即可把a的虛線框去掉。
通過傳遞不同的參數(shù)，可以去掉更多的虛線框，比如”BUTTON”可以去掉button按鈕的虛線邊框。
參數(shù)要用大寫字母。

轉(zhuǎn)載：http://www.decimage.com/web/remove-dotted-border-when-click-on-link-or-input.html#

本文題目：去除input，a，按鍵鏈接時出現(xiàn)的虛線方法-創(chuàng)新互聯(lián)
標題鏈接：http://www.rwnh.cn/article10/dgsddo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站設(shè)計公司、軟件開發(fā)、網(wǎng)站排名、App設(shè)計、標簽優(yōu)化、網(wǎng)站維護

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)