Copie los estilos de enfoque nativos del navegador | Programar Plus

Remy documentó esto el otro día. Firefox admite una Highlight palabra clave y tanto Chrome como Safari admiten una -webkit-focus-ring-color palabra clave. Entonces, si, por ejemplo, ha eliminado el enfoque de algo y desea volver a colocarlo en el mismo estilo que el navegador predeterminado, o desea aplicar un estilo de enfoque a un elemento cuando no está directamente en foco, esto puede ser útil.

Por ejemplo:

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

Me parece bien. Es especialmente útil con el nuevo estilo extraño de doble contorno de Chrome que sería un poco complicado de replicar de otra manera.

cromo 84
Safari 13.1
Firefox 80