Foros del Web » Creando para Internet » CSS »

Problema con A:Hover

Estas en el tema de Problema con A:Hover en el foro de CSS en Foros del Web. Hola amigos, tengo un problema con mi css, cuando intento poner mas de un A:Hover, solo me aparece en mi web, el 1º que he ...
  #1 (permalink)  
Antiguo 11/03/2009, 14:33
Avatar de nolose  
Fecha de Ingreso: diciembre-2007
Ubicación: España
Mensajes: 164
Antigüedad: 10 años
Puntos: 2
Problema con A:Hover

Hola amigos, tengo un problema con mi css, cuando intento poner mas de un A:Hover, solo me aparece en mi web, el 1º que he definido.

He encontrado varios post que tratan este tema de usuarios que les pasaba lo mismo que a mi, pero no consigo hacerlo funcionar yo. He intentado a poner a:hover#hover1, definirlo de mil maneras, ect, pero no consigo arreglarlo... y el caso es que lo necesito con un poco de urgencia porque llebo dias intentando arreglarlo y se me echa el plazo de entrega en clase encima.

Pongo aqui mi codigo a ver si alguien pudiera decirme como es....


Gracias!!!!!!


.csslocalizacion {
font-family: verdana;
font-size: 11px;
COLOR: #333333;
}

.cssrojo {
font-family: verdana;
font-size: 11px;
COLOR: #990000;
}

.cssrojo_grande {
font-family: verdana;
font-size: 15px;
COLOR: #990000;
}

.cssrojo_grande2 {
font-family: verdana;
font-size: 15px;
COLOR: #EB051F;
}

.cssnegro {
font-family: verdana;
font-size: 11px;
COLOR: #000000;
}

.fila_0 {
font-family: verdana;
font-size: 21px;
COLOR: #FFFFFF;
background-color: #E3E8EC;
}

.fila_1 {
font-family: verdana;
font-size: 21px;
COLOR: #FFFFFF;
background-color: #ECF1F6;
}

.csstyle {
font-family: verdana;
font-size: 11px;
COLOR: #FFFFFF;

}


A:hover {
COLOR: #CCCCCC; TEXT-DECORATION
}
A {
FONT-WEIGHT: none; FONT-SIZE: 11px; COLOR: #FFFFFF; FONT-STYLE: normal; FONT-FAMILY: verdana; TEXT-DECORATION: none
}
  #2 (permalink)  
Antiguo 11/03/2009, 14:57
 
Fecha de Ingreso: febrero-2009
Mensajes: 193
Antigüedad: 8 años, 10 meses
Puntos: 3
Respuesta: Problema con A:Hover

nolose...

cuando vos pones en el css a:hover... se aplica a todos los links existentes en el sitio..

Para agregar otros a:hover... tenes que hacer lo siguiente...

Por ejemplo un caso...

<div id="contenedor"><a href="seccion.html">Link</a></div>

En el css le das color al hover de este link de la siguiente manera...

#contenedor a:hover {color:#ffffff;}

En caso de que sea <div class="contenedor"><a href="seccion.html">Link</a></div>

.contenedor a:hover {color:#ffffff;}

En caso de que sea <p id="footer"><a href="seccion.html">Link</a></p>

p#footer a:hover {color:#ffffff;}

Espero que se haya entendido!

Saludos
  #3 (permalink)  
Antiguo 11/03/2009, 15:39
Avatar de nolose  
Fecha de Ingreso: diciembre-2007
Ubicación: España
Mensajes: 164
Antigüedad: 10 años
Puntos: 2
Respuesta: Problema con A:Hover

y puedo dejar el A:hover general y luego poner como tu dices el contenedor para un caso especifico??
  #4 (permalink)  
Antiguo 11/03/2009, 15:49
 
Fecha de Ingreso: enero-2008
Mensajes: 163
Antigüedad: 9 años, 10 meses
Puntos: 2
Respuesta: Problema con A:Hover

si porque estas especificando que el div se maneja por el id contenedor
  #5 (permalink)  
Antiguo 11/03/2009, 15:54
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con A:Hover

Saludos!!

El problema que tiene es algo bastante basico. El problema que tu tienes es de orden.

Para que tu a:hover funcione, tienes segui este orden.

a:link{}
a:visited{}
a:hover{}
a:focus{}
a:active{}

De esta forma, todos funcionaran correctamente

te dejo Este enlace que te amplía la informacion de las pseudo-clases.

Cita:
A:hover {
COLOR: #CCCCCC; TEXT-DECORATION
}
A {
FONT-WEIGHT: none; FONT-SIZE: 11px; COLOR: #FFFFFF; FONT-STYLE: normal; FONT-FAMILY: verdana; TEXT-DECORATION: none
}
Si ves aqui lo tienes al reves, y las propiedades en mayusculas. Siempre es mejor trabajar en minusculas el CSS.

Y para la proxima, recuerda ponerle algo al text-decoration, no lo escribas si no le vas a poner propiedades no?

Espero que te sirva! Hasta Luego!!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #6 (permalink)  
Antiguo 11/03/2009, 16:25
Avatar de nolose  
Fecha de Ingreso: diciembre-2007
Ubicación: España
Mensajes: 164
Antigüedad: 10 años
Puntos: 2
Información Respuesta: Problema con A:Hover

Acabo de hacer algunas mejoras, pero creo que no acabo de cojerlo...

Como veis, quiero que cssrojo, tenga otro a hover distinto (lo pongo abajo)

.csslocalizacion {
font-family: verdana;
font-size: 11px;
color: #333333;
}

.cssrojo_grande {
font-family: verdana;
font-size: 15px;
color: #990000;
}

.cssrojo_grande2 {
font-family: verdana;
font-size: 15px;
color: #EB051F;
}

.cssnegro {
font-family: verdana;
font-size: 11px;
color: #000000;
}

.fila_0 {
font-family: verdana;
font-size: 21px;
color: #FFFFFF;
background-color: #E3E8EC;
}

.fila_1 {
font-family: verdana;
font-size: 21px;
color: #FFFFFF;
background-color: #ECF1F6;
}

.csstyle {
font-family: verdana;
font-size: 11px;
color: #FFFFFF;

}

a:link{color: #FFFFFF; text-decoration: none}
a:visited{color: #FFFFFF; text-decoration: none}
a:hover{color: #CCCCCC; text-decoration: none}
a:active{color: #FFFFFF; text-decoration: none}



.cssrojo {
font-family: verdana;
font-size: 11px;
color: #990000;
}

#cssrojo a:hover {color:#333333;}
  #7 (permalink)  
Antiguo 11/03/2009, 16:31
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con A:Hover

jmm... en todo caso seria asi:

.cssrojo { bla bla }
.cssrojo:hover { bla bla }

Tienes que tener en cuenta que cuando pones a:hover estas diciendo que solo los links tendran el hover activado, porque antepones la etiqueta a, de esta forma funciona el hover.

Si le pones cssrojo:hover entonces estas haciendo que todo el elemento tenga hover.

Ahora si lo entiendes mejo? deberias ver el enlace que te envié, esta muy bien detallado el uso del hover.
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #8 (permalink)  
Antiguo 11/03/2009, 16:51
Avatar de nolose  
Fecha de Ingreso: diciembre-2007
Ubicación: España
Mensajes: 164
Antigüedad: 10 años
Puntos: 2
De acuerdo Respuesta: Problema con A:Hover

FENOMENAL!!!! ya lo consegui...

Muchas gracias a todos por vuestra ayuda :):) Dejo posteado aqui la solución por si le sirve de ayuda a alguien.

El a:hover hace el efecto de cambio color a TODOS los links, y el .cssnegro:hover solo le afecta al estilo cssnegro, podeis ponerselos a tantos estilos como querais.


.csslocalizacion {
font-family: verdana;
font-size: 11px;
color: #333333;
}

.cssrojo {
font-family: verdana;
font-size: 11px;
color: #990000;
}

.cssrojo_grande {
font-family: verdana;
font-size: 15px;
color: #990000;
}

.cssrojo_grande2 {
font-family: verdana;
font-size: 15px;
color: #EB051F;
}

.fila_0 {
font-family: verdana;
font-size: 21px;
color: #FFFFFF;
background-color: #E3E8EC;
}

.fila_1 {
font-family: verdana;
font-size: 21px;
color: #FFFFFF;
background-color: #ECF1F6;
}

.csstyle {
font-family: verdana;
font-size: 11px;
color: #FFFFFF;

}

/*PARA PONER UN LINK EN OTRO COLOR CONCRETO... USAMOS LAS ETIQUETAS .cssnegro:link */
/*NO OLVIDAR AÑADIRLO LUEGO EN EL a href*/

.cssnegro {
font-family: verdana;
font-size: 11px;
color: #000000;
}

.cssnegro:link{color: #000000; text-decoration: none}
.cssnegro:visited{color: #000000; text-decoration: none}
.cssnegro:hover{color: #990000; text-decoration: none}
.cssnegro:active{color: #000000; text-decoration: none}


/*Y ASI DECLARAMOS LOS ESTILOS NORMALES */

a:link{color: #FFFFFF; text-decoration: none}
a:visited{color: #FFFFFF; text-decoration: none}
a:hover{color: #CCCCCC; text-decoration: none}
a:active{color: #FFFFFF; text-decoration: none}


Un abrazo!!! y gracias de nuevo!!
  #9 (permalink)  
Antiguo 11/03/2009, 16:58
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Problema con A:Hover

De nada!! Que bien que te sirviera...

SI tienes algun otro problema no dudes en preguntar eh!

Hasta Luego!!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #10 (permalink)  
Antiguo 11/03/2009, 22:31
 
Fecha de Ingreso: febrero-2009
Mensajes: 7
Antigüedad: 8 años, 9 meses
Puntos: 0
Respuesta: Problema con A:Hover

puedes aplicar clases tambien

a.link2:hover no se q mas lo siento pero mas o menos asi es es que ase tiempo no uso css :D
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 12:53.