Poner enlaces en colores diferentes. DW

bien_macho · #1 (**permalink**) 14/01/2009, 10:37

Hola. gracias por leer mi pregunta.

Este es mi problema...

defino en propiedades de pagina el color de los vinculos..

Supongamos que yo lo defino como azul...

ahora todo los vinculo de mi pagina salen en color azul...

Como hago si yo por ejemplo tengo algo asi

Enlace 1 | Enlace 2 | Enlace 3 | Enlace 4

En teoria tengo todos los enlaces de color azul

Pero yo quiero que me salga... el primero azul el segundo amarrilo el tercero negro y el cuarto roza...

Se puede hacer esto?

em ayudan?

ElJavista · #2 (**permalink**) 14/01/2009, 10:55

Ok, para hacer eso hay dos formas, ambas usando CSS, de hecho el Dream también lo usa automáticamente, pero como todo lo automático, es limitado. Entonces tendrías que trabajar con el código.

Bien, esta es la primera forma, a cada enlace le pones una clase, por ejemplo:

<a href="enlace1" class="azul">Enlace 1</a> |
<a href="enlace2" class="amarillo">Enlace 2</a> |
<a href="enlace3" class="negro">Enlace 3</a> |
<a href="enlace4" class="rosa">Enlace 4</a>

Ahora un poco más arriba entre <head> y </head> vas a hallar hallar algo así:

<style type="text/css">
.........
.........
.........
/*Los puntos suspensivos representan estilos que el Dream ha generado. Solo tienes que agregar lo siguiente */
.azul {
color: #0000FF;
}
.azul:hover {
color: #0080FF; /*Por si acaso quieras cambiar de color cuando el mouse está encima*/
}
.amarillo {
color: #00FFFF;
}
.amarillo:hover {
color: #80FFFF;
}
........
........
</style>

Bien, esta forma es la que te conviene, hay otra pero sería en otro caso que a lo mejor también te podría servir alguna vez:

Colocas todos los enlaces a los que quieres darle un estilo común (no es tu caso) en un contenedor, lo más usual es usar un DIV

<div class="contenedor">
<a href="enlace1"> Enlace 1 </a>
<a href="enlace2"> Enlace 2 </a>
<a href="enlace3"> Enlace 3 </a>
<a href="enlace4"> Enlace 4 </a>
</div>

Ahora vamos a darle el estilo común:

.contenedor a {
color: #0000FF;
}
.contendor a:hover {
color: #000080;
}

Espero que te sirva.

slibanez10 · #3 (**permalink**) 14/01/2009, 10:56

Si lo que se desea es que aparezca sin subrayado o de otro color, o ambas cosas, se puede recurrir a una instruccion de estilo. Así:

<A HREF="www.google.com"
style="color:red; text-decoration:none";> Link de prueba </A>.

Y se vería así: Link de prueba (Esto puede que no funcione en algunos navegadores antiguos)

slibanez10 · #4 (**permalink**) 14/01/2009, 10:57

Si lo que se desea es que aparezca sin subrayado o de otro color, o ambas cosas, se puede recurrir a una instruccion de estilo. Así:

<A HREF="www.google.com"
style="color:red; text-decoration:none";> Link de prueba </A>.

Y se vería así: Link de prueba (Esto puede que no funcione en algunos navegadores antiguos)

bien_macho · #5 (**permalink**) 14/01/2009, 11:35

Si!

todo esto me ayudo mucho.

Y solucione mi problema y ya se como solucionar los proximos

Gracias

piyu · #6 (**permalink**) 21/10/2009, 15:10

uhuhuh te pasaste gracias, andaba buscando tu respuesta!!!