Deshabilitar el cambio de color de la etiqueta de ancla cuando se visita

Question

Debo desactivar el cambio de color de la etiqueta de anclaje cuando se visita. Hice esto:

a:visited{ color: gray } 

(El enlace es de color gris antes de la visita). Pero esta es una forma en la que declaro explícitamente el color después de visitar el enlace, que de nuevo es un cambio de color.

¿Cómo puedo desactivar el cambio de color de la etiqueta de anclaje cuando se visita sin hacer ningún cambio de color explícito?

Answer 1

No se puede, solo se puede aplicar estilo al estado visitado.

Para otras personas encuentran esto, asegúrese de que usted los tiene en el orden correcto:

a {color:#FF0000;}  /* unvisited link */ 
a:visited {color:#00FF00;} /* visited link */ 
a:hover {color:#FF00FF;} /* mouse over link */ 
a:active {color:#0000FF;} /* selected link */ 

Answer 2

Elimine el selector o configúrelo del mismo color que su texto aparece normalmente.

Answer 3

Para :hover para anular :visited, y para asegurarse de :visited es el mismo que el color inicial, :hover debe venir después de :visited.

Si quiere deshabilitar el cambio de color, a:visited debe aparecer antes de a:hover. De esta manera:

a { color: gray; } 
a:visited { color: orange; } 
a:hover { color: red; } 

Para desactivar :visited cambio que habría diseñarlo con la clase no sea de pseudo:

a, a:visited { color: gray; } 
a:hover { color: red; } 

Answer 4

Si lo que desea el color de anclaje permanezca igual como elemento principal del ancla puede aprovechar heredar:

a, a:visited, a:hover, a:active { 
    color: inherit; 
} 

Observe que no hay necesidad de repetir la regla para cada selector; solo use una lista de selectores separados por comas (el orden importa para los pseudo elementos de anclaje). Además, se pueden aplicar los pseudo selectores a una clase si desea desactivar selectivamente los colores especiales de anclaje:

.special-link, .special-link:visited, .special-link:hover, .special-link:active { 
    color: inherit; 
} 

Su pregunta sólo se le pregunta sobre el estado visitado, pero asumido que quería decir todos los estados. Puede eliminar los otros selectores si desea permitir cambios de color en todos los visitados.

Answer 5

a:visited { 
    text-decoration: none; 
} 

pero solo afectará a los enlaces que aún no se hayan hecho clic.

Answer 6

Puede resolver este problema llamando a los selectores a:link y a:visited. Y sígalo con el selector a:hover.

a:link, a:visited 
{color: gray;} 
a:hover 
{color: skyblue;}