Firefox：CSS：按鈕集中時改變風格

Question

有可能remove the extra Firefox-specific spacing from <button> tags。唯一的缺點是，當您將焦點對準鍵盤上的按鈕時，輪廓將會丟失。

我非常想讓我的按鈕在Chrome，IE8，Firefox中保持一致。如果我可以使用CSS :hover，我可以使用相同的樣式輕鬆地將按鈕顯示爲焦點，從而消除Firefox間距和輪廓。

有什麼辦法可以在沒有JavaScript的情況下做到這一點？我不在乎其他瀏覽器是否忽略這個規則。事實上，如果存在這樣的事情，我更喜歡:-moz-focused，所以我可以確定它不會在其他瀏覽器中發生。另外，如果Chrome風格的外部輝光可以在Firefox中完成，那麼這將是兩倍的好。

Answer 1

實際上，有一個:focus選擇器。這不是你需要的嗎？

a:hover, a:active, a:focus { 
    border: 1px dotted #f00; 
} 

我做這個有相當不錯的結果，但它是可能的點擊和標籤的正確組合與一個以上的元素拉閘突出顯示（一個主動，另一個重點）。儘管您可能會考慮在懸停/活動和焦點之間進行視覺區分，但不會成爲正常使用中的問題。

另請注意，在IE8和9中支持:focus，但不支持早期版本。 （quirksmode.org上的圖似乎表明它不能在8中工作，但測試顯示不然）。

Answer 2

爲此，CSS有:focus選擇器，其工作方式與:hover類似，但適用於具有焦點的元素。似乎沒有一個Firefox特定的版本。