Artículos
Bootstrap

Listas menú con Bootstrap

31/Jul/2015

Una de las formas más comunes y accesibles de crear un menú de elementos es utilizando una lista y convirtiéndola en un formato menú modificando sus estilos. En este ejemplo vamos a ver como podemos crear listas menú con Bootstrap.

Lo primero que deberemos será crear una lista desordenada mediante un elemento ul de HTML:

  • Elemento 1
  • Elemento 2
  • Elemento 3
  • ...
  • Elemento N

Esto creará una lista normal con sus bullets. Quedando algo parecido a esto:

  • Elemento 1
  • Elemento 2
  • Elemento 3
  • Elemento N

Para convertir este tipo de listas en listas menú con Bootstrap solo tenemos que manejar la clase «list-inline». Asignando dicha lista al atributo class del elemento ul.

De esta manera el código de nuestras listas menú con Bootstrap sería:

  • Elemento 1
  • Elemento 2
  • Elemento 3
  • ...
  • Elemento N

El resultado que obtendríamos en nuestra página web se parecería a lo siguiente:

  • Elemento 1
  • Elemento 2
  • Elemento 3
  • Elemento N

Aunque las listas menú con Bootstrap son la base para construir los menús de nuestras páginas web no hace falta que profundices sobre este elemento. Ya que Bootstrap nos ofrece otros elementos más avanzados para la gestión de menús como son los nav y navbar. Pero esto ya los veremos en otros ejemplos.

Espero que os haya gustado y os sea de utilidad el saber cómo crear listas menú con Bootstrap.

Código Fuente

Descárgate el código fuente de Listas menú con Bootstrap
Y si te ha gustado nuestro código fuente puedes regalarnos una estrella Star

Vídeos sobre Bootstrap

Disfruta también de nuestros artículos sobre Bootstrap en formato vídeo. Aprovecha y suscribete a nuestro canal.

Test Bootstrap

¿Te atreves a probar tus habilidades y conocimiento en Bootstrap con nuestro test?

Test Bootstrap
Suscribir
Notificar de
guest
1 Comentario
Recientes
Anteriores Más votados
Opiniones integradas
Ver todos los comentarios