Foros del Web » Creando para Internet » HTML »

Botones de colores

Estas en el tema de Botones de colores en el foro de HTML en Foros del Web. Que hay gente. Tengo este problema: estoy haciendo un web, y debajo del banner del header va a haber un menu con custro opciones. Despues ...
  #1 (permalink)  
Antiguo 06/09/2010, 16:40
Avatar de Blanck  
Fecha de Ingreso: septiembre-2010
Mensajes: 10
Antigüedad: 7 años, 3 meses
Puntos: 0
Mensaje Botones de colores

Que hay gente. Tengo este problema: estoy haciendo un web, y debajo del banner del header va a haber un menu con custro opciones. Despues de tocar todo (soy medio novato aun) logre que al pasar el puntero sobre las opciones del menu, su fondo cambie del color del theme a otro que yo ponga (puse amarillo, como prueba), es decir esto:

Sin el puntero encima


Con el puntero encima


La cosa es que quiero que cada opcion del menu se ponga de un color diferente, pero no logro hacerlo y siempre me quedan las cuatro del mismo tono. Este es mi code:

En el HTML
Código:
<div id="menu">
        	<ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Sobre Nosotros</a></li>
            <li><a href="#">Servicios</a></li>
            <li><a href="#">Contacto</a></li>
            </ul>
      </div>
En el CSS
Código:
#menu ul {text-align:center;list-style:none; padding:0;}
#menu ul li {display:inline}
#menu ul a { font-weight:bold; font-size:14px; text-decoration:none; color:#fff; background-color:#445d6c; padding:0 10px 2px 10px;}
#menu ul a:hover { background-color:#ffd800;}
  #2 (permalink)  
Antiguo 06/09/2010, 16:49
 
Fecha de Ingreso: junio-2010
Ubicación: Detrás de mi pantalla
Mensajes: 137
Antigüedad: 7 años, 6 meses
Puntos: 20
Respuesta: Botones de colores

La forma mas cencilla de cambiar los colores de los botones es con fireworks
Revisa aqui http://vodpod.com/watch/4234958-crear-menu-boton-con-macromedia-fireworks-gratis

Saludos!
  #3 (permalink)  
Antiguo 06/09/2010, 17:19
Avatar de Blanck  
Fecha de Ingreso: septiembre-2010
Mensajes: 10
Antigüedad: 7 años, 3 meses
Puntos: 0
Respuesta: Botones de colores

Esa es buena SoyNoob, pero no tengo firewroks. ¿Hay alguna otra forma?.
  #4 (permalink)  
Antiguo 06/09/2010, 18:36
Avatar de chulifo  
Fecha de Ingreso: abril-2009
Ubicación: perdido en codigos del PHP, pero aprendo rapido!
Mensajes: 523
Antigüedad: 8 años, 7 meses
Puntos: 18
Respuesta: Botones de colores

Código HTML:
Ver original
  1. <div id="menu">
  2.             <ul>
  3.             <li id="iten1"><a href="#">Home</a></li>
  4.             <li id="iten2"><a href="#">Sobre Nosotros</a></li>
  5.             <li id="iten3"><a href="#">Servicios</a></li>
  6.             <li id="iten4"><a href="#">Contacto</a></li>
  7.             </ul>
  8.       </div>

Código CSS:
Ver original
  1. #iten1 a:hover { background-color:#000;}
  2. #iten2 a:hover { background-color:#096;}
  3. #iten3 a:hover { background-color:#F00;}
  4. #iten4 a:hover { background-color:#ffd800;}
__________________
Solo soy un simple fanático que mata el tiempo de la mejor manera.
  #5 (permalink)  
Antiguo 06/09/2010, 18:45
Avatar de Blanck  
Fecha de Ingreso: septiembre-2010
Mensajes: 10
Antigüedad: 7 años, 3 meses
Puntos: 0
Respuesta: Botones de colores

¡Muchas gracias chulifo, funciona perfecto!
  #6 (permalink)  
Antiguo 11/09/2010, 04:56
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Botones de colores

Hola:

No necesitas, a menos que quieres un color distinto para cada opción, definir un id por cada opción, bastará que cambies esto:

Código CSS:
Ver original
  1. #menu ul li a:hover { background-color:#ffd800;

Cita:
Iniciado por SoyNoob Ver Mensaje
La forma mas cencilla de cambiar los colores de los botones es con fireworks
¿Y que haces un botón para cada color? ¿Y eso es más sencillo?

Saludos.

  #7 (permalink)  
Antiguo 07/01/2011, 13:55
 
Fecha de Ingreso: enero-2011
Mensajes: 5
Antigüedad: 6 años, 11 meses
Puntos: 0
Respuesta: Botones de colores

a mi también me ha servido muchas gracias! pero una pregunta mas como hago para que el color se vaya poco a poco.. ejemplo el navegador de esta web.

http://www.interviewmagazine.com/#

vamos que me gustaria saber como hacer el efecto de estos botones!

MUCHISIMAS GRACIAS!!!

Etiquetas: botones, colores
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 02:06.