CSS Pseudo Clases

¿Qué son las pseudo clases?

Las pseudo clases se usan junto con el selector para agregarle a este algún efecto especial.

Sintaxis de las pseudo clases

La sintaxis está compuesta por 4 elementos:

selector:pseudo-clase {propiedad:valor}

a:link {color:#00FF00}

El elemento <a> y las pseudo clases

Si por ejemplo desea que los enlaces se vean de algún color determinado antes de ser visitados y de un color distinto después de visitarlos, este sería el codigo a utilizar.

Código

<head>
<style type="text/css">
a:link {color:#FF0000} /* Color rojo - enlace no visitado */
a:visited {color:#00FF00} /* Color verde - enlace visitado */
</style>
</head>

<body>
<a href="fin.html">Si presiona el enlace cambiará al color verde</a>.
</body>

Resultado

Si presiona el enlace cambiará al color verde

Propiedades de las pseudo clases

Propiedad	Descripción	Ej.
:link	Enlaces no visitados.
:visited	Enlaces visitados.
:active	Cuando es activado(tiempo entre que se pulsa un botón sobre él y se suelta).
:hover	Cuando se posiciona el cursor sobre él pero no se activa.
:focus	Cuando tiene el foco posicionado sobre él.
:lang	Especifica el lenguaje usado en el elemento.
:first-child	Cuando es el primer hijo de un elemento padre.

Búsqueda

Otros tutoriales

HTML
Herramientas Utiles

Google

Diseño Web

Intercambio

Banners
Links

Virtualnauta provee del material para uso exclusivo de aprendizaje.
No garantizamos que el contenido sea correcto.
El riezgo por el uso del mismo queda bajo la entera responsabilidad del usuario.
Mientras use este sitio, usted acuerda haber leido y aceptado nuestros términos de uso y privacidad.

webmaster@virtualnauta.com

Mapa del sitio

Básico

Avanzado

Ejemplos y Examen

Guías de referencia