Puede probarlo usted mismo haciendo clic en un enlace y quitando el mouse de ese enlace antes de soltarlo. O bien, active la preferencia “Usar siempre las teclas del cursor para navegar dentro de la página”, navegue con el cursor y vea cómo se delinean los enlaces.
Por lo general, este estilo predeterminado no es gran cosa. Los enlaces normalmente están activos solo por una fracción de segundo antes de que se cargue una nueva página y el esquema desaparezca. Sin embargo, hay circunstancias en las que desea eliminar este esquema.
Tenga en cuenta que este estilo literalmente usa la propiedad CSS “esquema”. El contorno es muy similar al “frontera” propiedad, con dos diferencias importantes. Primero, el contorno rodea todo el objeto (al igual que usar solo “borde”), pero es posible que no sea específico sobre los lados. “Esquema-izquierda” no existe. Dos, el valor del esquema no es parte del modelo de caja. El borde se calcula en el ancho total del cuadro, mientras que el contorno no. Esto es importante para que los diseños no se muevan cuando se aplica y elimina el contorno.
como quitarlo
Si desea que desaparezca, y desea que desaparezca en cada enlace de anclaje, simplemente incluya esto como parte de su restablecimiento de CSS:
a {
outline: 0;
}En general, recomiendo dejar activo el estilo de contorno predeterminado, pero hay algunas circunstancias en las que es bastante molesto y debe desactivarse. Por un lado, si tiene un elemento de página que usa grandes cantidades de relleno (como para el posicionamiento) o está flotando, estos contornos pueden colocarse de manera muy extraña o incluso extenderse por todo el ancho de la pantalla. Solo se ve mal. Otro escenario es si roba el evento de “clic” de un enlace de anclaje para otro propósito (como, para activar algunas magias de JavaScript). Ese clic ya no cargará una nueva página, por lo que el esquema se activará y permanecerá así hasta que haga clic en otro lugar, mucho más feo que la vista rápida y temporal que normalmente obtiene al hacer clic en un enlace.
Asegúrate de agregar nuevos estilos de enfoque
Debido a que ese esquema proporcionaba una característica de accesibilidad importante, realmente debería (realmente) considerar agregar un estilo para el enfoque de sus enlaces y los estados activos. Personalmente, me gusta hacerlos igual que el estado flotante. Se trata de lo mismo, en cuanto a la función real. Cualquiera que sea su estado de desplazamiento, incluso si está cambiando una imagen de fondo o cambiando de tamaño o lo que sea, se puede unir con los estados activo y de enfoque. Al igual que:
a:hover, a:active, a:focus {
/* styling for any way a link is about to be used */
}Guau. Realmente tenía la intención de que este artículo tuviera 3 oraciones de largo y 1 fragmento de código. ¡Las cosas nunca son tan simples como yo quiero que sean!
Destello
Si tiene problemas con esta línea punteada en un objeto/incrustación Flash, puede:
object, embed {
outline: 0;
}Entradas de Firefox
Al hacer clic hacia abajo en un input type=image puede producir un contorno punteado (lo hace en Firefox 3.6.8 pero no en Firefox 4). Para eliminarlo:
input::-moz-focus-inner {
border: 0;
}IE 9
George Langley escribió para decir que IE 9 aparentemente no le permite eliminar el contorno punteado alrededor de los enlaces a menos que incluya esta metaetiqueta:
<meta http-equiv="X-UA-Compatible" content="IE=9" />