2 min de lectura

Menú horizontal HTML CSS

Veamos como crear un menu horizontal utilizando unícamente HTML y CSS.
Puedes ver también la entrada anterior donde hemos visto como crear un menú vertical con HTML y CSS.

Paso 1: Crear la lista con las opciones del menú

Lo cual de momento se ve así:

Notemos que la lista tiene ya los enlaces, pero estos apuntan dentro de la misma página a ningún lugar utilizando el símbolo numeral (#).

Paso 2: Dar formato a la lista

2.1: Tamaño y posición

Aplicar las propiedades float y clear para cargar el menú hacia el lado requerido. Poner el ancho del menú al total de la página.

2.2: Quitar viñetas y márgenes

Eliminar las viñetas automáticas y todos los márgenes y espaciados aplicados por defecto:

2.3: Acomodar los elementos en horizontal

La clave para el menú horizontal reside en modificar la propiedad float de los elementos <li> del menú

2.4: Estilos a los elementos

Aplicar estilos a los enlaces

Compartir
Licenciada en Informática con Maestría en Tecnologías de la Información. Docente por convicción con trece años de experiencia, desarrolladora desde hace nueve años trabajando actualmente con desarrollo WEB para alta disponibilidad, además de ser consultor independiente y capacitador. Participe del movimiento del software libre como fiel apasionada, reconocida por su actividad en la comunidad y su participación en la inclusión.

4 COMENTARIOS

  1. Hola que tal Michelle, es un gusto saludarte.
    Quisiera saber si puedes apoyarme con un tema que tengo.
    Estoy creando una aplicacion web en la que requiero anexar un boton en el cual el cliente haga un pago y se haga el cargo a su tarjeta, podrás asesorarme, es que no tengo ni idea como funciona esta parte de enlace con lso bancos o es alguna utilería?
    de antemano agradezco
    saludos

DEJA UNA RESPUESTA

Please enter your comment!
Please enter your name here