Foros del Web » Creando para Internet » CSS »

Menu CSS con estados

Estas en el tema de Menu CSS con estados en el foro de CSS en Foros del Web. Hola, que tal? Estoy tratando hace unos días de modificar un poco los colores de mi menu css pero no lo he logrado. He creado ...
  #1 (permalink)  
Antiguo 26/05/2008, 12:07
 
Fecha de Ingreso: julio-2007
Mensajes: 57
Antigüedad: 10 años, 4 meses
Puntos: 1
Menu CSS con estados

Hola, que tal? Estoy tratando hace unos días de modificar un poco los colores de mi menu css pero no lo he logrado. He creado una clase "selected" para ponersela en cada sección del sitio correspondiente. Acá va el código así comprenden mejor:

Html:
Código:
<div id="buttons">
<ul>
<li><a href="/">Historia</a></li>
<li><a href="/">Contacto</a></li>
<li><a href="/">Recursos</a></li>
<li><a href="/">Links</a></li>
<li><a href="/">Galería</a></li>
<li class="selected"><a href="/">Inicio</a></li>
</ul>
</div>


Css:
Código:
#buttons {
padding:1em;
height:1.5em;
color:#ffffff;
}
#buttons li {
float:right;
list-style-type:none;
white-space:nowrap;
}
#buttons li a {
display:block;
padding:0 5px;
font-size:1.2em;
font-weight:normal;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}
#buttons .selected {
color:green;
text-decoration:none;
}

#buttons a:hover{
color:red;
text-decoration:none;
}
El problema es que no me funciona la clase selected, le puse color:green como para ver la diferencia pero no anda.
Espero que me puedan ayudar.

Saludos Y Muchas gracias

PD: www.cincomasdos.com.ar/DEMO2/index.html

Última edición por juampick; 26/05/2008 a las 12:12 Razón: Cambio de color de partes importantes y link sitio
  #2 (permalink)  
Antiguo 26/05/2008, 12:14
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Menu CSS con estados

Creo que debes dar la clase a la ancla, pues está dentro del li, y por tanto sus características lo sobreescriben. Suerte!
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #3 (permalink)  
Antiguo 26/05/2008, 12:21
 
Fecha de Ingreso: julio-2007
Mensajes: 57
Antigüedad: 10 años, 4 meses
Puntos: 1
Respuesta: Menu CSS con estados

Cita:
Iniciado por daPhyre Ver Mensaje
Creo que debes dar la clase a la ancla, pues está dentro del li, y por tanto sus características lo sobreescriben. Suerte!
He probado cambiando a

Código:
#buttons li a .selected {
color:green;
text-decoration:none;
}
pero no se soluciona. Alguna ayudita??
  #4 (permalink)  
Antiguo 26/05/2008, 12:52
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Menu CSS con estados

Me refería a esto:

Código HTML:
<li><a class="selected" href="/">Inicio</a></li> 
Y otro detalle, no se muy bien como funcionen las clases dentro de los identificadores. Si no funciona, prueba primero sin todo lo que precede a .selected en el CSS. Suerte!
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #5 (permalink)  
Antiguo 26/05/2008, 12:52
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Menu CSS con estados

Cita:
Iniciado por juampick Ver Mensaje
He probado cambiando a

#buttons li a .selected {
color:green;
text-decoration:none;
}

pero no se soluciona. Alguna ayudita??
Hola, juampick.

Está mal puesto. Debe ser

#buttons li.selected a {
color:green;
text-decoration:none;
}

Pruébalo a ver.

Mikel.
  #6 (permalink)  
Antiguo 26/05/2008, 13:58
 
Fecha de Ingreso: julio-2007
Mensajes: 57
Antigüedad: 10 años, 4 meses
Puntos: 1
Sonrisa Respuesta: Menu CSS con estados

Cita:
Iniciado por Mikmoro Ver Mensaje
Hola, juampick.

Está mal puesto. Debe ser

#buttons li.selected a {
color:green;
text-decoration:none;
}

Pruébalo a ver.

Mikel.
Increible, perfecto Mikel!
Ando hermoso. Ahora entiendo por qué no funcionaba era un "pequeñísimo error". Otra consultita: se puede hacer que en el hover haya como una especie de transición entre 2 colores en loop?? .
Espero que me entiendas.

Gracias

Última edición por juampick; 26/05/2008 a las 14:00 Razón: error ortografico :S
  #7 (permalink)  
Antiguo 26/05/2008, 15:38
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Menu CSS con estados

No, lo siento, no sé qué quieres decir.

Mikel.
  #8 (permalink)  
Antiguo 26/05/2008, 16:19
 
Fecha de Ingreso: julio-2007
Mensajes: 57
Antigüedad: 10 años, 4 meses
Puntos: 1
Respuesta: Menu CSS con estados

Disculpa mi falta de expresión. Quiero saber cómo se puede hacer para modificar mi boton para que sea igual que ahora solamente que en el estado hover en vez de ser asi:
Código:
#buttons a:hover{
color:red;
text-decoration:none;
}
realice en vez de un cambio de color a red haga una transición de colores, es decir vaya entre un amarillo y azul por ejemplo. Me explico ahora?
Hay alguna forma? o tendría que realizarlo con imagenes?

Saludos y muchas gracias por el interés
  #9 (permalink)  
Antiguo 26/05/2008, 17:39
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Menu CSS con estados

No lo sé al cien por cien, pero estoy casi seguro de que no es posible. Eso tendrías que hacerlo con un gif, en el que hagas la transición en dos o más escenas.

Mikel.
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 13:30.