Foros del Web » Creando para Internet » CSS »

Comohacer para que en una misma pagina el color de dos textos vinculados sea distinto

Estas en el tema de Comohacer para que en una misma pagina el color de dos textos vinculados sea distinto en el foro de CSS en Foros del Web. he diseñado una pagina en la que los textos vinculados aparecen en color gris, y al pasar el puntero sobre de ellos se pone blanco, ...
  #1 (permalink)  
Antiguo 19/10/2004, 13:58
 
Fecha de Ingreso: octubre-2004
Mensajes: 79
Antigüedad: 13 años, 1 mes
Puntos: 0
Pregunta Comohacer para que en una misma pagina el color de dos textos vinculados sea distinto

he diseñado una pagina en la que los textos vinculados aparecen en color gris, y al pasar el puntero sobre de ellos se pone blanco, mi problema es que una parte de esta pagina es gris, por lo que algunos textos al vincularlos no se ven ya que son del mismo color que el fondo, me gustaria saber si se puede que solo esos textos que estan sobre el fondo gris pueda cambiarles el color, quedando los demas como estaban.

Gracias.
  #2 (permalink)  
Antiguo 19/10/2004, 14:11
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
Puedes aplicarles clases o id's...

<a href="" class="link1">enlace</a>
<a href="" class="link2">enlace2</a>

Salud
  #3 (permalink)  
Antiguo 19/10/2004, 16:46
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
Hola Importtex

Aquí te dejo un código para que lo modifiques a tu gusto

pega esto entre <head> y </head>


Código:
<style type="text/css">
<!--
a:link { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #ffffff; }
a:active { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #000000; }
a:visited { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color:  #114477; }
a:hover { text-decoration: underline;font-family: Verdana,Arial;font-size: 12px;color: #c9c9c9; }
</style>
solo tienes que cambiar los colores y listo , espero te haya servido...
slds...
__________________
_______
Jorge Rojas.
  #4 (permalink)  
Antiguo 19/10/2004, 16:47
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
mmm, aunque creo que este tema correspondería mas al foro de CSS. Pero igual...
__________________
_______
Jorge Rojas.
  #5 (permalink)  
Antiguo 19/10/2004, 17:23
 
Fecha de Ingreso: enero-2003
Ubicación: Córdoba, Argentina
Mensajes: 1.047
Antigüedad: 14 años, 10 meses
Puntos: 10
completo un poco las dos respuestas de los amigos iconogt y jesusbet:

Cita:

<html>
<head>
<style type="text/css">
<!--
a:link { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #CC0000; }
a:active { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #000000; }
a:visited { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #114477; }
a:hover { text-decoration: underline;font-family: Verdana,Arial;font-size: 12px;color: #c9c9c9; }

a.diferente:link { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #666666; }
a.diferente:active { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #000000; }
a.diferente:visited { text-decoration: none;font-family: Verdana,Arial;font-size: 12px;color: #CC0000; }
a.diferente:hover { text-decoration: underline;font-family: Verdana,Arial;font-size: 12px;color: #0000FF; }

-->
</style>
</head>

<body>

<a href="#">Enlace Comun</a>
<a href="#" class="diferente">Enlace diferente</a>
</body>
</html>
__________________
oohh... quisiera ser godines!!!
  #6 (permalink)  
Antiguo 21/10/2004, 06:26
 
Fecha de Ingreso: octubre-2004
Mensajes: 79
Antigüedad: 13 años, 1 mes
Puntos: 0
Muchisimas Gracias lo he conseguido.

Muchas Gracias ya estan listo, parece una tonteria pero me ocaciono bastante quebradero de cabeza, y al final tuve que acudir a los expertos Gracias
  #7 (permalink)  
Antiguo 21/10/2004, 08:25
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 16 años, 3 meses
Puntos: 380
Cita:
Iniciado por iconogt
mmm, aunque creo que este tema correspondería mas al foro de CSS. Pero igual...
Efectivamente

Nos vamos para el foro de CSS

movido desde (x)html

saludos
  #8 (permalink)  
Antiguo 21/10/2004, 09:05
Ex Colaborador
 
Fecha de Ingreso: junio-2002
Mensajes: 9.091
Antigüedad: 15 años, 6 meses
Puntos: 16
Hola,

Bueno, yo estoy empezando en esto, pero voy a dar otra opcion (que tiene que ver con la C de CSS).
Cita:
me gustaria saber si se puede que solo esos textos que estan sobre el fondo gris pueda cambiarles el color, quedando los demas como estaban.
Supongo que el color de fondo de esa zona la especificas con CSS de otro elemento. Para este caso, pongamos que un div:
Código:
div.gris {
  brackground-color: gris;
}
Pues tambien puedes hacer
Código:
div.gris {
  brackground-color: gris;
}

div.gris a {
  color: azul;
}
y
Código HTML:
<div class="gris"><a href="pagina">link</a></div> 
Que significa simplemente "todos los <a> dentro de un <div> de la clase 'gris' tienen color azul".

¿Por que puede ser esto mejor que la otra solucion? Primero, te ahorras un nombre de clase Segundo, te ahorras teclear (si tienes 10 <a> en los div grises tendrias que escribir 10 veces class="diferente"). Tambien ahorras transferencia, el fichero es mas ligero.

Saludos.

PD: Ya se que el codigo de los colores no es el correcto, es solo para que se entienda el ejemplo. No vaya a ser que alguien lo copie tal cual y se queje de que no funciona
__________________
Josemi

Aprendiz de mucho, maestro de poco.

Última edición por josemi; 21/10/2004 a las 09:09
  #9 (permalink)  
Antiguo 21/10/2004, 15:19
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
Hola de nuevo

Tengo una pregunta que creo que ya había hecho antes pero igual.

cuando hacen esto:

Código:
div.gris {
 }
Es lo mismo a esto?

Código:
div#gris {
 }
Es decir, la función del punto (.) es la misma función que la que hace el signo (#), eso me tiene un poco confundido...
__________________
_______
Jorge Rojas.
  #10 (permalink)  
Antiguo 21/10/2004, 15:22
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
jajaaja, una preguntilla... ¿como hacen para mover los temas?

Lo siento si deje una tontería.
__________________
_______
Jorge Rojas.
  #11 (permalink)  
Antiguo 21/10/2004, 15:29
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
Conforme a tu primer pregunta:
- cuando en tu documento pones por ejemplo:
<p class="parrafo1">esto es un parrafo de clase parrafo1</p>
Para darle estilo en tu CSS usas el punto

- cuando en tu documento pones:
<p id="parrafo1">esto es un parrafo con identificador parrafo1</p>
en tu CSS debes usar el gato #

Conforme a tu segunda pregunta, los mensajes los mueven los moderadores, supermoderadores y administradores.

Salud
  #12 (permalink)  
Antiguo 21/10/2004, 18:45
Avatar de iconogt  
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 573
Antigüedad: 13 años, 3 meses
Puntos: 4
Ok,

Ya te entiendo, gracias, jeje
__________________
_______
Jorge Rojas.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:14.