Kopiere Browser's native Fokus-Stile

Remy dokumentierte dies neulich. Firefox unterstützt das Schlüsselwort Highlight und sowohl Chrome als auch Safari unterstützen das Schlüsselwort -webkit-focus-ring-color. Wenn Sie also beispielsweise den Fokus von etwas entfernt haben und ihn im gleichen Stil wie der Browser-Standard wiederherstellen möchten, oder einen Fokus-Stil auf ein Element anwenden möchten, wenn es selbst nicht direkt im Fokus ist, kann dies nützlich sein.

Zum Beispiel:

button:focus + span {
  outline: 5px auto Highlight;
  outline: 5px auto -webkit-focus-ring-color;
}

Sieht gut aus. Besonders hilfreich ist der etwas seltsame neue Chrome-Doppelrahmenstil, der sonst etwas schwierig zu replizieren wäre.