所有瀏覽器的自定義焦點指示器

Question

每個瀏覽器都有自己的焦點指示器，如： 當通過鍵盤選項卡焦點對焦時，Firefox具有虛線。 Chrome提供了一個藍色邊框

有什麼辦法來設置所有的瀏覽器自定義焦點指示符？

我曾嘗試以下

:focus { 
    outline: 2px solid #0000ff; } 

，但它不工作。

Answer 1

：焦點是一個僞元素，因此它需要附加到其他鏈接。查看我的示例，然後單擊鏈接框，它將變爲紅色，並使用：focus屬性進行樣式設置。如果在任何瀏覽器工作：

a { 
 
background: #efefef; 
 
    padding: 1em; 
 
    text-decoration: none; 
 
} 
 

 
a:focus 
 
{ 
 
    background: red; 
 
    }

<a href="#">Sample link</a>