Css

Menú desplegable con css (básica)

En este post te enseñare paso a paso como hacer un menú desplegable con css, te mostrare la estructura html que utilizare y el código css.

Si no tienes conocimiento de css, te invito a ver los anteriores post donde te explico para que sirven varios códigos.

Estructura Html de Menú desplegable con css:

Menú desplegable

Esta es la estructura que yo utilizare pero ustedes pueden agregarle mas submenu tanto como ustedes deseen o necesiten lo siguiente que haremos sera darle estilo a nuestro menú desplegable con css.

🌟 ¡Visita Nuestra Tienda para Programadores! 🌟

Descubre Códigos Fuente, Cursos, Software, Computadoras, Accesorios y Regalos Exclusivos. ¡Todo lo que necesitas para llevar tu programación al siguiente nivel!

Estilo a Menú desplegable con css:

Menú desplegable

Lo que estamos haciendo es quitarle el margin  y el padding que tienen por defecto las paginas, le quitamos la viñetas y la forma de enlace que trae nuestras.

La parte visual debe verse de esta manera hasta el momento.

Menú desplegable

Ahora haremos que los Submenu se oculten y que nuestro menu tenga un hover  para cada vez que pase el mouse haga su efecto.

menú desplegable

Con este código podemos dar por terminado nuestro menú y pueden ver el efecto que le da el Hover  al pasar el mouse sobre el menú, se debe ver de esta forma.

menú desplegable

En un siguiente les mostrare paso a paso como hacer un menú vertical estilo acorde.

Comentarios

Aún no hay comentarios. ¿Por qué no comienzas el debate?

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *