CSS 去除瀏覽器預設 輪廓外框

標籤：div   適用於   ica   規範   如何   等等   連結   put   消失   

 在預設情況下，點擊 a 標籤，input，或者添加click事件的時候，瀏覽器留下一個輪廓外框（chrome之下為藍色）~ 然而這些預設的輪廓外框，有時候很影響美觀，並不是我們想保留的。 我們應如何消除這些討厭的 輪廓外框呢？

使用outline:none去除輪廓外框

如：

a{ outline:none; }

PC端輪廓外框消失了，然而發現在手機上依然存在~~

這時候添加如下代碼便可

a{     outline:none;      -webkit-tap-highlight-color:rgba(0,0,0,0);}

 

-webkit-tap-highlight-color 是一個 不規範的屬性（unsupported WebKit property），它沒有出現在 CSS 規範草案中。

當使用者點擊iOS的Safari瀏覽器中的連結或JavaScript的可點擊的元素時，覆蓋顯示的醒目提示。

該屬性可以只設定透明度。如果未設定透明度，iOS Safari使用預設的透明度。當透明度設為0，則會禁用此屬性；當透明度設為1，元素在點擊時不可見。

文法：

-webkit-tap-highlight-color：color

預設值： inherit

適用於：連結元素比如新視窗開啟，img元素比如儲存映像等等

取值：

color：顏色值

transparent：透明值

* CSS3新增屬性可能存在描述錯誤及變更，僅供參考，持續更新

相容性：

• iOS 1.1.1及更高版本的Safari瀏覽器可用
• 大部分android手機也是支援的，只是顯示效果有所不同。

PS：本文轉自http://www.cnblogs.com/AllenChou/p/4726012.html，感謝分享

CSS 去除瀏覽器預設 輪廓外框