如何刪除Firefox中的按鈕周圍的藍色邊框？

我使用的是Firefox 10，Windows 7並且不確定較舊的版本，但是當我單擊按鈕時，按鈕周圍會出現藍色邊框。如何刪除Firefox中的按鈕周圍的藍色邊框？

我創建了下面的示例。

我刪除了虛線和CSS之下，但我也不想藍色邊框。我無法確定如何刪除它，甚至可以刪除它？

button::-moz-focus-inner, 
input[type="button"]::-moz-focus-inner 
{ 
    border: none; 
    outline: none; 
}

下面沒有工作......

input[type="button"]:visited 
{ 
    outline: none; 
    border: none; 
}

這是我講的邪惡藍色邊框。

enter image description here

2012-03-02 masato-san

Visited？從什麼時候按鈕被標記訪問？您使用的操作系統（和主題，如果適用）？考慮提供一個截圖，太... – 2012-03-02 07:05:23

我知道一個：訪問，所以我只是給了一個沒有工作的嘗試 – 2012-03-02 07:07:07

啊，你可以嘗試沒有'：visited';它只適用於訪問過的鏈接，而一個按鈕不是鏈接。我的機器上沒有在Firefox中出現藍色邊框，所以我無法測試它... – 2012-03-02 07:07:47

也就是說火狐的用戶界面，無論是主題還是沒有。不是你從編碼中得到的東西。

如果它讓你感到非常困擾，你可以重新設定它並定義你自己的風格。這是一個重置規則。

button { background: none transparent; border: none; }

而且您以後可以在其上添加你的造型。這是一個demo。您可以按照自己想要的方式爲hover，visited，active定義自定義狀態。

2012-03-02 07:21:00 Starx

+1給你演示和東西:) – Sarfraz 2012-03-02 07:37:15

啊我看到了，所以沒有辦法保持按鈕看起來像，只能刪除藍色邊框...感謝演示:) – 2012-03-02 07:45:57

這個藍色邊框（這是操作系統和主題相關）表示該按鈕具有鍵盤焦點。虛線輪廓表示同樣的事情。如果您不關心如何讓使用鍵盤的用戶訪問您的應用程序，那麼您可以完全重新設置按鈕，以便在按鈕處於焦點時沒有獨特的外觀。

由於您看到的按鈕外觀是由OS /瀏覽器主題而不是CSS指定的，因此無法通過CSS告知瀏覽器「將此按鈕繪製爲未聚焦」。

還請注意<button>和<input type="button">之間的差異;您可以在第一個示例中指定CSS匹配，但不在第二個示例中。

2012-03-02 08:01:13

感謝您的見解:) – 2012-03-02 08:32:00

回答