MANUALES

TUTORIAL CSS:

Lección 6: Enlaces

Los enlaces en CSS permiten definir estas propiedades de forma diferente dependiendo del estado del mismo, es decir, si el enlace se ha visitado, no se ha visitado, si es el enlace activo o si el cursor está sobre dicho enlace. Esto permite añadir efectos.Para controlar estos efectos se usan lo que se ha denominado como pseudo-clases.

¿Qué es una pseudo-clase?

tiene en cuenta diferentes condiciones o eventos al definir una propiedad para una etiqueta HTML.

los enlaces se especifican en HTML con la etiqueta <a>. 

Todo enlace tiene diferentes estados. Ejemplo, visitado o no visitado, enlaces activos y cuando el cursor se coloca o pasa sobre el enlace.

 Puedes usar una pseudo-clase para asignar diferentes estados:

a:link  (No visitados)

a:visited (visitados)

a:active  (Enlaces Activos)

a:hover   (Cursor sobre el enlace o cuando este pasa sobre el)

 
 a:link {
  color: blue;
 }

 a:visited {
  color: red;
 }
 
 

Pseudo-clase a:link

Enlaces que dirigen a páginas que el usuario no ha visitado.

 
 a:link {
  color: #6699CC;
 }  

Pseudo-clase a:visited

Enlaces que dirigen a páginas que el usuario ya ha visitado. 

 
 a:visited {
  color: #660099;
 }

Pseudo-clase a:active:

Enlaces que están activos.

 
 a:active {
  background-color: #FFFF00;
 }

Pseudo-clase a:hover

Cuando el puntero del ratón pasa por encima de un enlace.

Por ejemplo, si queremos que nuestros enlaces sean de color naranja y estén en cursiva cuando el cursor pase sobre ellos, el código CSS que utilizaremos será el siguiente:

 
 a:hover {
  color: orange;
  font-style: italic;
 }

Propiedades que se pueden aplicar a los enlaces:

• letter-spacing
• text-transform

Quitar el Subrayado de los Enlaces: Con la propiedad text-decoration:none;

 
 a {
  text-decoration:none;
 }  

TOMADO DE: http://es.html.net/tutorials/css/lesson6.php