Bootstrap 5 Crash Course Tutorial #9 - Navbars
HTML-код
- Опубликовано: 20 июн 2021
- In this Bootstrap 5 tutorial you'll learn how to use the navbar component and we'll add it to our page design.
🐱👤 View this course in full now - without ads - on Net Ninja Pro:
netninja.dev/p/bootstrap-5-cr...
🐱💻 Access the course files on GitHub:
github.com/iamshaunjp/bootstr...
🐱💻 HTML & CSS Crash Course:
• HTML & CSS Crash Cours...
🐱💻 Node.js Crash Course:
• Node JS Tutorial for B...
🐱💻 SASS Crash Course:
• SASS Tutorial #1 - Wha...
🐱💻 VS Code - code.visualstudio.com/
🐱💻 Bootstrap 5 Docs - getbootstrap.com/docs/5.0/get...
🐱💻 Social Links:
Facebook - / thenetninjauk
Twitter - / thenetninjauk
Instagram - / thenetninja
This is the best bootstrap5 course I've seen
Thanks :)
I know
@@NetNinja 2 years later. still the best one
You explain Bootstrap navbar very well. Thanks mate
This video convinced me to subscribe to this channel.
I appreciate how well you made it crystal clear.
it's funny to hear you say "crap, how am I gonna remember all of this classes"😆🤣
brilliant explanation!! thanks for the tutorial.
amazing ! finally someone who is getting all this easier. Do you have a javacript complete course ?
Great tutorial, thanks for explaining this stuff!
Got a question about something that wasn't covered in this video though, so I thought maybe someone here could help me. In the official docs it says that "navbars are hidden by default when printing." I'm not sure I understand what is meant by it. I just put a nav element on my page and gave it a .navbar class. Added some lorem ipsum between the nav tags too. Did a Ctrl + P and behold, the lorem ipsum is right there, ready to be printed. What could "hidden when printing" really mean in this case?
Brilliant...It's amazing how you explained everything. You have one more new subscriber. Keep it up with the good work. Cheers !!!
Awesome, thank you Jane, I appreciated that :)
thank you mate, amazing tutorial!!! 😊👍👍👍
For anyone wanting the expanded list to appear below the button instead of on the left, try adding the class "align-items-end" on the ul-element. You might also need to change the container class from "container-xxl" to just "container". Hope this helps someone.
Thank you, Net Ninja!
I learn a lot from your channel Shaun.. Always suport and Thankyou so much
Hello Ninja, Please do a video on graphql with react and redux.. there is a lot of confusion like 1. when we using graphql is that necessary to use apollo client. 2. Apollo client is a replacement for Redux 3. Both apollo and redux can be used in same project etc pls clarify
Shaun, I'd really appreciate it if you could help me justify the nav-items when they're expanded, such as at 10:32. How does one go about it? I'd like them to be positioned at the center rather than stick to the left side.
I'm a back-end guy and I hate all the front-end stuff 😄 thank you for the course it helps 😊🤓
Amazing video series. Thank you so much!
You're very welcome!
Thanks for the video!!
I love it bootstrap 5 is awesome with the way you've delivered it I will be using it for my next client. You've also helped me leverage
Great to hear! :)
Your videos helped me a lot! Mange tak!
I would like to ask how can we add the hover effect onto links? So when I hover a link it gonna change its color into red as an example?
Greetings from Denmark.
Best regards
I copied from githb your lesson and the links on the nav bar are not on the top navbar as you have shown, there are not visible, what is wrong ?
thanks a lot best teacher ever
2:00 Why put the container under the navbar instead of the navbar under the container? Many of these choices are never explained in videos and tutorials.
navbar is outside since it has to contain all the elements you use to create your navbar, it's also better for semantic html
Great content
Best Bootstrap tutorial on the internet 🚀
I agree!
Thank you for this
Thank you so much for your tutorials really helpful, could you please make tutorial describe Bootstrap Mega Navbar, thanks again.
Amazing tutorial ^_^
wow this tutorial helps alot
LMAO you're so much better than my instructor. FYI I'm not skipping any ads so you can have higher revenue in RUclips hahah. Thank you for this wonderful tutorial.
At the end of this course, please explain about customization in Sass. thank you for this course.
Hey, I'll do this in the last couple of lessons - but also a new course about bootstrap 5 customization is coming soonish too.
@@NetNinja cool..you're awesome. Your vue course on udemy is amazing. Enjoying it now.
Thanks so much :)
@@NetNinja great. looking forward.
Vue couse link
Thanks👌👌
thanks a lot
Is there a function in Bootstrap that makes the hamburger menu close automatically after clicking on a link?
thank you!
You're welcome!
I want the navigations options to be seen on big screens and then instead of collapse I want them in offcanvas, searching for solutions everywhere and not getting
U are amazing
thanks
Great tutorial, but I don't think the class align-center is valid or does anything.
late to the party, but he probably means align-items-center
how can we set a custom color for nav?
Hey, can you make an Tutorial about the new Tailwind JIT Module?
I will try and fit this in soon :)
ty
Why when you have on navbar links justify-content-end the links are on the left when you expand it instead of the right? How to put them right below the expanding button?
I'm having the same issue. were you able to figure this out?
@@kenellem.6233 Hi, on the navigation container add margin-left: auto and it will put the buttons on the right.
@@TheMrFelin didn't work for me
Removing the container-xll worked for me :)
I had to add the class align-items-end on the ul-element
my english is not that well , cant even read that fast
but damn, i could understand what you talking from the start to the end
Hey Ninjas, I would like to ask How to actually grasp bootstrap ?, Do I first understand the code orelse should I do it side by side to understand, coz i am not able to grasp those big big codes........ please need help anyone I would be grateful on your reply.
you need to understand javascript and css.... with bootstrap, just copy and manipulate. not worth actually remembering all of this shit. just understand the basics of what bootstrap is manipulating
@@michaelwest2451 Thanks buddy
great video but I still don't understand when people say bootstrap faster than css
Why the Bootstrap 5 classes name very confusing..?
because they follow BEM model... they aren't that confusing lmao.... You need to learn BEM class naming convention also read Bootstrap documentation.... Lazy people are always complaining.... 🤣🤣🤣
🥰🥰🥰🥰🥰🥰🥰🥰
😣👍🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊
all of this is overwhelming... I hate this.
It's not. I love it
Everything went great until the 8th video my man. Stick with generic not building a website would have been much better.
I have to disagree, in my opinion it is way better to learn on a realworld example. Maybe it's just me but only learning the generics won't let me understand the great opportunities you get.
not satisfied...
Why?
womp womp