2.- Formato de los enlaces con CSS.
El formato de los enlaces es un detalle muy importante en nuestra página Web. El hecho de que cambie el color del enlace cuando ya ha sido visitado hará la navegacion mas fluida para el visitante, ya que impedirá que visite sin querer los enlaces que ya ha visto.
Este código presenta la cuatro propiedades mas comunes de los enlaces: el color cuando no se ha vistado, el color cuando ha sido visitado, el color del ultimo enlace visitado, y el color que toma cuando se pone el puntero del ratón sobre él.
Como podeis ver el código CSS se posiciona en la cabecera de la página (head), los enlaces a los que queremos dar formato se posiciona dentro de una capa, que se delimita por las etiquetas
con un nombre que se le asigna a cada capa como puede verse en el código.
<html>
<head>
<title>Formato de enlaces con CSS.</title>
<STYLE TYPE="text/css">
<!--
#enlace a { /* Color del enlace no visitado AZUL */
text-decoration: none; color: #0000FF;
}
#enlace a:visited { /* Color del enlace visitado ROJO */
text-decoration: none; color: #FF0000;
}
#enlace a:active { /* Color que toma el ultimo enlace visitado VERDE */
text-decoration: none; color: #008000;
}
#enlace a:hover { /* Color que toma el enlace al pasar el raton sobre el GRIS*/
text-decoration: none;
color: #666666;
}
-->
</STYLE>
</head>
<body>
<DIV ID="enlace">
<p><a href="http://www.uterra.com">INICIO</a></p>
<p><a href="http://www.uterra.com/codigo_html/codigo_fuente_html.php">HTML</a></p>
<p><a href="http://www.uterra.com/codigo_javascript/codigo_fuente_javascript.php">Javascript</a></p>
<p><a href="http://www.uterra.com/codigo_css/codigo_fuente_css.php">CSS</a></p>
<p><a href="http://www.uterra.com/codigo_php/codigo_fuente_php.php">PHP</a></p>
</DIV>
</body>
</html>
