• Miércoles 24 de Abril de 2024, 07:05

Autor Tema:  Aplicar estilo css a un menu  (Leído 2546 veces)

crs94

  • Nuevo Miembro
  • *
  • Mensajes: 1
    • Ver Perfil
Aplicar estilo css a un menu
« en: Viernes 24 de Junio de 2011, 04:42 »
0
Hola a todos la verdad soy un novato asi que les pido de su ayuda miren lo que pasa
este es mi codigo <style type="text/css">
li {
  border-style: solid;
  border-color: #f0d7b5;
  border-width: 2px 1px 0;
  margin: 0 2px;
  float: left;
  height: 40px;
  line-height: 40px;
  width: 90px;
  text-align: center;
  background-color: #aa876f;
}
   </style>
<ul style="
  margin: 0 40px 0 0;
  padding: 0;
  font-size: 105%;
  list-style-type: none;
  float: right;">
<li>Menu</li>
<li>Home</li>
<li>Contaction</li>
</ul>



AHora digamos que tengo un estilo el que sea inventenselo ustedes pero lo que quiero es saber como hacer que con el onmouse over se aplique este estilo por favor ayudenme y si pueden expliquenme cada parte del codigo que si me interesa aprender como le aria?

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Aplicar estilo css a un menu
« Respuesta #1 en: Viernes 24 de Junio de 2011, 13:52 »
0
Cita de: "crs94"
Hola a todos la verdad soy un novato asi que les pido de su ayuda miren lo que pasa
este es mi codigo <style type="text/css">
li {
  border-style: solid;
  border-color: #f0d7b5;
  border-width: 2px 1px 0;
  margin: 0 2px;
  float: left;
  height: 40px;
  line-height: 40px;
  width: 90px;
  text-align: center;
  background-color: #aa876f;
}
   </style>
<ul style="
  margin: 0 40px 0 0;
  padding: 0;
  font-size: 105%;
  list-style-type: none;
  float: right;">
<li>Menu</li>
<li>Home</li>
<li>Contaction</li>
</ul>



AHora digamos que tengo un estilo el que sea inventenselo ustedes pero lo que quiero es saber como hacer que con el onmouse over se aplique este estilo por favor ayudenme y si pueden expliquenme cada parte del codigo que si me interesa aprender como le aria?


Mira en estas paginas, puedes descargar muchos ejemplos, es cuestion de analizar el codigo:

viewtopic.php?t=5710
http://cssmenumaker.com/horizontal_css_menu.php

Lo que necesitas primero es leer algun curso/manual.

Saludos
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================

fonsi3

  • Miembro activo
  • **
  • Mensajes: 95
    • Ver Perfil
Re: Aplicar estilo css a un menu
« Respuesta #2 en: Lunes 27 de Junio de 2011, 18:25 »
0
Debes aplicar la pseudo-class "hover", que se activa cuando se hace "mouseover" sobre un elemento HTML, de esta manera por ejemplo

Código: CSS
  1. li:hover {
  2.     color: #ff0063
  3.     background: #22ff22
  4. }
  5.  

Aqui tienes mas informacion: http://www.w3.org/TR/CSS2/selector.html
Cha che chi cho chu buenichimo!
http://mensoscripts.com

Links de interes: HTML | CCS2~CSS* | PHP
Indispensables tools]Firebug[/url] | Web Developer | FireFTP | Live Headers