CSS también permite aplicar diferentes estilos a un mismo enlace en función de su estado. De esta forma, es posible cambiar el aspecto de un enlace cuando por ejemplo el usuario pasa el ratón por encima o cuando el usuario da clic sobre ese enlace.
CSS define las siguientes cuatro pseudo-clases:
- :link, aplica estilos a los enlaces que apuntan a páginas o recursos que aún no han sido visitados por el usuario.
- :visited, aplica estilos a los enlaces que apuntan a recursos que han sido visitados anteriormente por el usuario. El historial de enlaces visitados se borra automáticamente cada cierto tiempo y el usuario también puede borrarlo manualmente.
- :hover, aplica estilos al enlace sobre el que el usuario ha posicionado el puntero del ratón.
- :active, aplica estilos al enlace que está pinchando el usuario. Los estilos sólo se aplican desde que el usuario pincha el botón del ratón hasta que lo suelta, por lo que suelen ser unas pocas décimas de segundo.
|
1 2 3 |
a.importante:visited { ... } a#principal:hover { ... } div#menu ul li a.primero:active { ... } |
|
1 2 3 4 5 6 7 |
/* Los estilos se aplican cuando el usuario pasa el ratón por encima de un enlace que todavía no ha visitado */ a:link:hover { ... } /* Los estilos se aplican cuando el usuario pasa el ratón por encima de un enlace que ha visitado previamente */ a:visited:hover { ... } |
¿Te gustó este artículo?
Si te gustó este artículo, te ha servido o aprendiste algo nuevo; compártelo en tus redes sociales o invítame un cafe.
