Colores de links [Archivo] - Foros Club Delphi

Ver la Versión Completa : Colores de links

CARLOS E

13-06-2006, 23:48:04

Hola
para dar un color distinto a los links de mi pagina utlizo el siguiente codigo

<style type="text/css"> < A:link {text-decoration:none; color:#ffffff} A:visited {text-decoration:none; color:#000000} A:active {text-decoration: none} A:Hover {text-decoration:none; color:#FF9933;}
</style>

pero como puedo hacer para que un grupo de links tengan esos colores y otro grupo de links(dentro de la misma pagina) adquieran otros?

dec

14-06-2006, 00:02:47

Hola,

Tendrás que "clasificar" los enlaces, o bien "identificar" alguno de ellos, o bien meterlos en marcos a los que luego puedas dar su correspondiente estilo, incluyendo los enlaces que contenga dicho marco.

¿Un ejemplo? Lo haremos únicamente con el "a:link", para no liarnos demasiado. Por cierto, que sepas que también valdría un "a", simplemente, para dar el mismo estilo a todos los enlaces, pero, a lo que vamos:

body { }

a:link { } /* Enlaces en todo el documento */

.enlace {} /* Enlaces de la clase "enlace" */

#enlace {} /* Enlace identificado como "enlace" */

div.marco a:link {} /* Enlaces dentro de "div" de clase "marco" */

div#marco a:link {} /* Enlaces dentro de "div" de ID "marco" */

Como ves puedes hacer diferentes "combinaciones" para lograr lo que pretendes. ;)

CARLOS E

14-06-2006, 02:02:37

Muchas gracias. He diseñado este ejemplo, aunque me ha funcionado a medias debido a que aun me aparecen los enlaces subrayados y solo en el color que tengo a:hover, que en la clase .pre es "#aaaaaa" y en la .ver "#ff9933"

¿que hago mal?

<style type="text/css">

.pre{A:link text-decoration:none; color:#AAAAAA A:visited text-decoration:none; color:#AAAAAA A:active text-decoration: none; A:Hover text-decoration:none; color: #AAAAAA}

.ver{A:link text-decoration:none; color:#FFFFFF A:visited text-decoration:none; color:#FFFFFF A:active text-decoration: none; A:Hover text-decoration:none; color: #FF9933}
</style>

<BODY bgcolor=black>
<A HREF="index.php" CLASS="PRE">   Inicio      </a>|
<A HREF="crea_anuncio.php" CLASS="PRE"> enlace x del grupo 1 </a><br>
<A HREF="preguntas.php" CLASS="PRE"> enlace y del grupo 1 </a><br>
<A HREF="recomienda.php" CLASS="PRE"> enlace z del grupo 1 </a><br>

<A HREF="pag1.php" CLASS="VER">   Inicio      </a>|
<A HREF="pag2.php" CLASS="VER"> enlace a del grupo 2 </a><br>
<A HREF="pag3.php" CLASS="VER"> enlace b del grupo 2 </a><br>
<A HREF="pag4.php" CLASS="VER"> enlace c del grupo 2 </a><br>
</BODY>

JavierB

14-06-2006, 19:09:58

Hola CARLOS E

Prueba con este código:

<style type="text/css">
.pre {text-decoration:none; color:#AAAAAA}
.ver {text-decoration:none; color:#FFFFFF}
</style>
</head>
<body style="background:black">
<a href="pagina1.html" class="pre">Enlace</a>
<a href="pagina2.html" class="ver">Enlace</a>
</body>

Saludos, :cool: