[ad_1]
https://i.ytimg.com/vi/sLos6pkMXK8/hqdefault.jpg
Tutorial Bootstrap 3: Barra de navegación y Menú
Otro elemento bastante típico y común en muchas páginas web es la zona de navegación, formada por enlaces a las zonas principales de la web, o por un menú de navegación, desplegable de enlaces, etc.
En esta guía creamos nuestra barra de navegación que tendrá la característica de ser responsiva.
Material y Código:
https://github.com/DevCodela/Guia-Bootstrap-3
Para seguir con esta iniciativa no te olvides de suscribirte al canal y seguirnos en facebook y twitter.
Twitter: https://twitter.com/DevCodela
Facebook: https://www.facebook.com/DevCode.la
Original source
39 responses to “Tutorial Bootstrap 3: Barra de navegación y Menú (Nav y Navbar)”
se escucha muy de fondo si puedes arreglar eso seria de mucho !
no me funciona el menu cuando se achica la pantalla es deir el boon con las 3 rayistas no hace nada que puede ser? gracias
Tengo un problema ya tengo un el menú junto con el logotipo pero lo que son las secciones del menú aparecen debajo del logotipo no a la par. Agradeceria de tu ayuda.
ola una pregunta con q editor de texto estas trabajando, como haces que tu codigo se genere con solo div>ul>li*3>a
gracias por el tuto
Hola yo quisiera saber como puedo alinear el menu al centro respecto a la página, es decir que los botones siempre queden al centro. espero me puedan ayudar y gracias por el vídeo.
como haces en referencia?
Excelente tutorial, pero como haces cuando estas en un dispositivo móvil y queres que al hacer click en un elemento de navegacion la barra desaparezca , porque hay que hacer click continuamente en el boton de navegacion para que desaparezca
buen dia, estoy intentando hacer la parte del menu desplegable y no me funciona y ya intente con todo que puedo hacer
no me funciona el menu desplegable, ya intente importando las librerias y nada..
llame los archivos con estos scripts.. pero necesito tener conexion a internet para que pueda aser su funcion..
<script src="js/vendor/jquery-1.11.0.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
PERO QUIERO QUE ME HAGA el menu despegable con estos.. por que importo
<Script src"js/jquery.js"></script>
<Script src"js/bootstrap.min.js"></script>
AYUDA!!!!!!!
Muchas gracias por la informacio tan increible
como le hago para cambiarle el color hover a los sub menus?
buenas tardes yo estoy teniendo muchos problemas para implementar el menu desplegable como explicas en este video, uso joomla 3.4.1 en mi web, bootstrap yo creo que estoy llamando bien a los archivos js y css con el codigo y a mi en mi pagina no me funciona el tutorial me sale un boton y listo algo que no deberia pasar saludos.
Hola Buen día, gracias por los tutoriales, me han servido de mucha ayuda, ya logre hacer el menú, pero estaba intentando cambiarle los colores y no puedo, quiero que se cambien los colores de las letras y del botón al pasar el cursor sobre él… Qué debería hacer??
Buenas noches . tengo un problema . cuando le doy click a boton no aparece el menu de igual forma cuando le doy click a dropdown tampoco realmente tengo pegado 2 dias espero que me pueda ayudar gracias
Hola, excelente tutorial! una consulta, como puedo centrar todo el menu?
Hola amigos, ante todo muchas gracias, sus videos son excelentes me han ayudado bastante. Pero hay un consulta que quisiera hacerles: ¿cómo se haría para crear un submenú dentro de otro submenú?. Por ejemplo si en el submenu BOOTSTRAP de su video se desprende otro submenú. Estoy usando bootstrap 3.3.2 . De antemano muchas gracias.
muy bien explicado gracias!
Hola, no se despliega el menu y no es el error de collaspe como comentan, que mas podría ser?
Eres mi salvacion!, tutos perfectos muchas gracias!
hola, me encanto tu tutorial, buenisimo, de hecho lo hice funcionar en mi pc y funciono de maravilla, pero a la hora de que lo hago correr en un movil de verdad, simplemente toma la version de tablet, ya no se que hacer para arreglarlo. saludos
El menu no se cierra… 🙁 se mantiene siempre abierto T.T
He buscado, y aún no se como solucionarlo
hola que plugins utilizas para el sublimetext ??
Resolví el problema El "error" del menu desplegable es que no llama los archivos de la carpeta vendor/js en <head>
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
<script src="js/vendor/bootstrap.js"></script>
<script src="js/vendor/jquery-1.11.0.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
Gracias por los tutoriales me agradan por que es muy concisos
cuales son los referenciales que colocas en tu head, porque no me correo bien el tuto
no me funciona el menu desplegable, ya intente importando las librerias y nada.
genial! me salvaste 😀
por si le sirve a alguien: Hay un "." que no se nota al comienzo de "data target" del boton del navbar header [data-target=".navbar-ex1-collapse"]
excelente vídeo amigo pero! no se que pasa hice todo al pie de la letra pero al llevarlo a la pantalla tamaño móvil no se despliega la barra me podrías ayudar gracias?
socio un fa ise lo que indica el tutorial pero al momento de probarlo con un dispositivo móvil no se despliega hay que importar algo en especial
y como personalizas el color y forma del menú en general? para crear un diseño personalizado completamente pero que no pierda la parte "responsive" (sin uso de templates)
Que función cumplen los span con el class="icon-bar"
Tengo el codigo bien y no me sirve la barra de navegación en la seccion de "tutoriales", que puedo hacer? Que librerías está importando? Porque yo tengo hasta las de bootstrap.js y aún así no se me despliega el menú, gracias!!
Muchas gracias por vuestros magníficos video-tutoriales. Tengo una duda acerca de cómo hacer un submenú. No encuentro en Boostrap 3, la clase "submenu". ¿Me podéis indicar cómo hacerlo?. Gracias de nuevo
Gracias me estan sirviendo mucho tus videos solo me gustaria que explicara un poco mas para que sirve cada cosa como data-toggle que es el toggle y en si las diferencias del nav y navbar y cositas asi pero esta bien ahi uno se va dando cuenta muchas gracias.
lo hice todo 3 veces verifique toda la sintaxis …y cuando lo pruebo para movil ,no se despliega
Hola que tal, buen video, pero tengo una duda o dudas, quiero cambiar el color de las letras del menú pero no sé como hacerlo cómo podría personalizar el diseño en esos aspectos? … intente poner un menú que no es de bootstrap pero cuando lo meto en su código a la hora de adaptarlo a la versión mobil el menú no se despliega en lista cuando le das clic al icono "de las 3 lineas" y aparece de corrido. Espero me pueda ayudar, saludos.
Tengo una duda, no hace falta entonces media querys con este sistema de grid?
y para que las utilizariamos entonces?
como haces para hacer el auto completado asi …ejemplo( ul>li*4 )
hola, oye tengo un problema, estoy tratando de aplicar lo que muestras en tu tutorial, pero cuando presiono el botón no se despliega el contenido del navbar, como si no tuviera nada. Ojalá pudieras ayudarme