We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

La pseudo-clase :visited de CSS  representa enlaces que el usuario ya ha visitado. Por motivos de privacidad, los estilos que se pueden modificar con este selector son muy limitados.

/* Selecciona cualquier <a> que ha sido visitado */
a:visited {
  color: green;
}

Los estilos definidos por la pseudo-clase :visited serán anulados por cualquier pseudo-clase posterior relacionada con el enlace (:link, :hover o :active) que tenga al menos la misma especificidad. Para darle un estilo apropiado a los enlaces, coloque la regla :visited después de la regla :link pero antes de las reglas :hover y :active, según lo definido por el orden LVHA: :link:visited:hover:active.

Restricciones de estilo

Por motivos de privacidad, los navegadores limitan estrictamente los estilos que puede aplicar utilizando esta pseudo-clase y cómo se pueden usar:

Nota: Para obtener más información sobre estas limitaciones y las razones detrás de ellas, vea Privacidad y el selector :visited.

Sintaxis

:visited

Ejemplo

Las propiedades que de otro modo no tendrían ningún color o serían transparentes no se pueden modificar con :visited. De las propiedades que se pueden establecer con esta pseudo-clase, su navegador probablemente solo tenga un valor predeterminado para color y column-rule-color. Por lo tanto, si desea modificar las otras propiedades, deberá darles un valor base fuera del selector :visited.

HTML

<a href="#test-visited-link">¿Ya has visitado este enlace?</a><br>
<a href="">Ya has visitado este enlace.</a>

CSS

a {
  /* Especifique los valores predeterminados no transparentes a ciertas propiedades,
     lo que les permite ser diseñado con el estado :visited */
  background-color: white;
  border: 1px solid white;
}

a:visited {
  background-color: yellow;
  border-color: hotpink;
  color: hotpink;
}

Resultado

Especificaciones

Especificación Estado Comentario
HTML Living Standard
La definición de ':visited' en esta especificación.
Living Standard  
Selectors Level 4
La definición de ':visited' en esta especificación.
Working Draft Ningún cambio.
Selectors Level 3
La definición de ':visited' en esta especificación.
Recommendation Ningún cambio.
CSS Level 2 (Revision 1)
La definición de ':visited' en esta especificación.
Recommendation Levanta la restricción para aplicar  :visited solo al elemento <a>. Permite a los navegadores restringir su comportamiento por razones de privacidad.
CSS Level 1
La definición de ':visited' en esta especificación.
Recommendation Definición inicial.

Compatibilidad con navegadores

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Soporte básico1 Si1 Si3.51
Restrict CSS properties allowed in a statement using :visited for privacy6 Si48 ?5
FeatureAndroid webviewChrome para AndroidEdge mobileFirefox para AndroidOpera AndroidiOS SafariSamsung Internet
Soporte básico4.4 ? Si4379.3 ?
Restrict CSS properties allowed in a statement using :visited for privacy ? ? ? ? ? ? ?

Ver también

Etiquetas y colaboradores del documento

Colaboradores en esta página: lajaso
Última actualización por: lajaso,