How to Create Responsive Navigation Bar With HTML & CSS in Hindi
How to Create Responsive Navigation Bar in HTML and CSS | Navbar using HTML CSS
In this video, I have created a Fully Responsive Navigation or Navbar Menu in Hindi language. I hope you will like this Responsive Navigation Bar. Feel free to download the source code file of this Navigation Menu from the given link.
----
Hire us on Fiverr
➤ www.fiverr.com/prakashahi
📁 Download Source Code Form Here
➤ www.codingnepalweb.com/respon...
Follow me on Instagram
➤ / coding.np
---
Timestamp:
00:00 Navigation Bar Intro and Demo
02:44 HTML Code for Navigation Menu
03:45 CSS Code for Responsive Navbar
10:10 Media query Code for Responsive
19:08 Final Output of Navigation Bar Menu
#ResponsiveNavbar
#NavigationMenuBar
#ResponsiveMenu
#ResponsiveNavbar
#ResponsiveMenuBar
#HTMLCSS
----
Music Credit:
Levianth & Axol - Remember (feat. The Tech Thieves) [NCS Release]
Music provided by NoCopyrightSounds.
➤ Watch: • Levianth & Axol - Reme...
---
Keywords:
responsive navigation menu using html and css,
responsive navbar using only html and css,
how to make responsive navigation bar in html and css,
how to make responsive navigation bar,
how to make responsive navigation bar in html and css in hindi,
how to make navigation bar in html and css,
responsive navigation bar with,
responsive navigation bar with html and css,
navigation bar in html and css,
navigation bar in html and css responsive,
responsive navbar html css,
css navigation
Пікірлер: 483
How To Create Simple Website Simple Website.
@suraj351
3 жыл бұрын
*Oh! Voice 🎙🎶* *Mujhe Accha Laga ki Tum Explanation karke Video Bana rahe ho...Thanks*
@harshitrathi3077
3 жыл бұрын
Please Reply Me In instagram
@Hacker-hm7nj
3 жыл бұрын
Sir, Your voice is very sweet. Please make more videos with voice. don't Use music........ Please Please Please.
@UniqueTBG
2 жыл бұрын
What Is The Coding Software You Use?
@RasticFuse
2 жыл бұрын
bhai sab samajh agaya yaar, thank you sooo much 😍😍
When we click on menu icon question is will it use its full height of header or the remaining content comes after menu button
thangs bhaiya your content is soo use full for menu bar i watch lot of video but me don't understand but when i did watch your video then me have been full understand about how to work navigation bar
If wanna menu button shows in also in PC then what should do
I saw tons of tutorials to learn response navbar... But From your video finally I created my first one.... 🔥🔥🔥🔥🔥 Thanqq soo much for this video... 1+ Subscribe from my side...
@CodingLabYT
2 жыл бұрын
Glad to hear that.. Best regards
Sir i have used this as header and i am try to add this with a page but it is no showing good the header and page are seeing side by side how to fix this
So does the navigation menu hide after you click on a nav link?
I want the same thing, but the navigation bar should be vertical.. Pls tell the changes that i have to do
*Oh! Voice 🎙🎶* *Bhai Mujhe Accha Laga ki Tum Explanation karke Video Bana rahe ho...Thanks*
@CodingLabYT
3 жыл бұрын
You're welcome.. Stay tuned 😁
AAP bahot hi simple way me batate ho ... Thank you Bhaiya ..😊
@CodingLabYT
Жыл бұрын
Glad you liked it. Best regards.
Bhai apne haklate haklate hmko sb kuch samjha diya Thanks bro 🙏🙏
Sir, first of all you are great coder, Sir maine bahut Shara video dekha but samgh mai nahi aaya but first time aapka video dekha or total clear hai Aap ka teaching karne ka method bahut simple hai jo easily beginners ko samgh mai aagayega god bless you sir ☺️
@CodingLabYT
2 жыл бұрын
Glad it was helpful.
Very helpful and inspiring! Thanks!
Such a good explanation..i searched for it the entire day but finally found this one...keep it up 👍
@CodingLabYT
2 жыл бұрын
I'm glad you like it
HY sir ankr tag lanagy sy words show hi ni ho rhy agr ankr tag ko remove kro phr show ho rhy h lkin without link k
Ap ny jb styling di tu nav pr double click Kiya tha ??? Mjhy yha sy smj ni aai kis trha aik or slide opn ho gi ???padding or margin wala
Great , but can you help me to and header for multiple pages as the if I navigate to second page then the respective page button is not active
Mene apki video 2 sal bad dekhrahu but ye video mujhe bohot accha laga he, ekdomse full details ke sath responsive kese karte he o iss video me apne bata diya hee 🙈🥰🥰🥰 or mene is video ko download karliya.thanks 😊
@CodingLabYT
Жыл бұрын
My pleasure!!
thank you bhai, majjale bujayew timile.
@CodingLabYT
Жыл бұрын
Always welcome
Thank u sir for your reply ! ❤ U r really making awsm content! Plus u also help out when its needed. Thanks a lot
@CodingLabYT
3 жыл бұрын
Thank you 💙😁... Stay tuned.
@AtulyaAndroidHacker
3 жыл бұрын
@@CodingLabYT bhai source code dedo #CodingNepal
@AtulyaAndroidHacker
3 жыл бұрын
@@CodingLabYT bhai coustom video and audio player banao na like pexels .com
Tnx brother me to JavaScript ka use karke baars ka use kar rha tha it is very useful video thanks to you 100%🙏
Bro, the way you explained everything was awesome and your menu is also great but it would be more perfect if you had added a dropdown in this menu. Can you help me ??
@CodingLabYT
3 жыл бұрын
Okey stay tuned ❣️😊
Sir my button is working but it can not convert into cross it only showing menu button. I check my script tag that is ok.
Thank you vere much, this video really helped me out I appreciate your efforts for making this kind of vid
@CodingLabYT
Жыл бұрын
Glad it helped!
I really learned a lot from this. Thank you. I'm sharing your work to my classmates.
@CodingLabYT
3 жыл бұрын
You're welcome... Stay tuned 😁
@MobjineYt
2 жыл бұрын
pourquoi tu ments
I have a problem with this how to auto hide when it's clicked on link
how to prevent scrolling when the input is checked cause its annoying when the ul is opned and you still can scroll the body and see the content behind it. I hope someone can get me
Great video. very helpful vedio. thanks for sharing your knowledge carry on bro and creating videos.
and your teaching and speaking about all one by one topic whise explation method is best
What you are doing bro so nice 👍 no one can teach me like you .......thank thank thank you bhai
@CodingLabYT
Жыл бұрын
Glad to hear that. Thankyou!!
You are just awesome♥️ Bahut badhiya se smajhaya
@CodingLabYT
2 жыл бұрын
Glad I could help !!
I'm coping content code to f007 but the cancel mark is not coming
Thanks bro 😁😁This is my first time that I have made something like this
@CodingLabYT
3 жыл бұрын
Always welcome my friend 😊❤️
Amazing sir I find the best video for making navigation bar from you thanks👍👍👍👍
@CodingLabYT
3 жыл бұрын
Glad to hear that
Hello sir ek doubt h aapne jab click id li to usme checked kr k tilled sign kyu lagaya?
@ CodingLab How is it that when you put the menu button in some videos it comes on left side while in other cases it appears in right automatically?
@WasimKhan-ux9qn
Жыл бұрын
instead of left write right in css. it will transite from right side
The button wont show in white and is missplaced when the screen is full ! Can I share you my code ?
Bro Awsome..... Actually I'm from South India U explained very well tht even I could understand.. Superb dude pls continue videos with explanation. Thanks dude
@CodingLabYT
Жыл бұрын
Thank you, I will
Bhaiy Aapka hindi bhot sunder hai i'm from chhattisgarh india
broo you are the best. God bless you. Aameen
Hey bro the way you explained no one can on KZread
@CodingLabYT
Жыл бұрын
Thanks a ton.
Have been struggling with the responsive navbar for a lot of days now. Finally today learnt how to do it. Thank you for the awesome guide. Subscribed instantly. 😃
@Codewithsalim07
6 ай бұрын
Same here 😂
video bahut accha tha explain bhi bahut sahi kiya bhai .Bhi index.html or style.css file mil jaye to bahut accha hoga
Aapka video bohot achcha hain ichaliye thanks. Lekin main chaahata hoon nested/dropdown mobile menu support for wordpress.
Really appreciate How you put all of your effort in making this video. Hope you will make this responsive thing much easier in life.
@CodingLabYT
3 жыл бұрын
It is responsive bro 😊❤️
@fivearmies5977
3 жыл бұрын
@@CodingLabYT already loved it I mean to say you can build more tutorials in future on this topic.
@CodingLabYT
3 жыл бұрын
Sure 😊 Stay Tuned ❤️
Thank uhh so much for this amazing tutorial 💚it's really helped for mee
@CodingLabYT
Жыл бұрын
My pleasure 😊
you are best teacher! thanks for such best job. God bless you
@CodingLabYT
Жыл бұрын
You are welcome!
A very simple & awesome explain this video. Thanks ❤️
@CodingLabYT
2 жыл бұрын
Glad you like it !!
Thank you so much. I was following webdev simplified he actually used JS to achieve this functionality but your way is really awesome, easy and more feasible. 🙏
@CodingLabYT
3 жыл бұрын
Glad to hear that.. Thanks a lot
This is wonderful and simple. Absolutely, easy to learn. Thank you so much
@CodingLabYT
2 жыл бұрын
Glad it was helpful!
Great video bro, but how to make the menu slide to the bottom not to the right when in mobile?
i wish every video tutorial has Voice over...:)
This content is awsome . you explain very well . thank u so much
@CodingLabYT
3 жыл бұрын
You're welcome Muskan
@CodingLab Smoth scrolling use krrke jo bhi navlink per click karo wo uss section per chala jaa raha hai per , pura navbar ka slider bhi khula rehta hai , usse kese thik kare?
@CodingLabYT
2 жыл бұрын
watch this - kzread.info/dash/bejne/f4GjzLSsgdTKnto.html
Its very helpfull ...Thanks bro..
@CodingLabYT
2 жыл бұрын
Glad it helped. Best regards!!
Sir If I Add Something In My Page And In Mobile If I Click On Menu Button It Overlaps It
@CodingLabYT
3 жыл бұрын
Give z-index more to button than other
Amazing job, i learned a lot, and the finish is amazing, but i did everything like you, and my menu when i clic the button appears sliding from right to the left, instead left to right like your video
best video.....keep it up
I do not understand 1 thing. How did you show the size of the screen. What is the method?
thanks for such an amazing tutorials. really helpful and even for free. Amazing tutorial.
@CodingLabYT
Жыл бұрын
Glad it was helpful!
thanks it helped a lot in my project
@CodingLabYT
2 жыл бұрын
You're welcome!
awesome bhai tension dur kar diya apne
@CodingLabYT
3 жыл бұрын
Glad to hear that
I was looking for tutorial which tells us what is the use of each element we were using!! Thanks a lot! GREAAAT VIDEO !!
@CodingLabYT
3 жыл бұрын
You're welcome Sahil
Great tutorial. simple and easy to follow!
@CodingLabYT
2 жыл бұрын
Glad it was helpful!
Amazing Bro..👏 Nice Content Deliver in a nice Way 👍👌
@CodingLabYT
Жыл бұрын
Thanks a ton
the fas bar thing arent working from mine
you solved my problem thank you very much
@CodingLabYT
2 жыл бұрын
You're Welcome. Best regards.
sir mere me botton check ho raha h but menu nhi aa raha hai -100% kiya to screen se left jaa raha hai lekin fir button check karne par aa nahi raha hai please help me
Thanks ! sir, your video helped me alot but my question is how to add a logo instead of any name (Brand) ...
Wow very wonderful this craft
@CodingLabYT
2 жыл бұрын
Thank you! Cheers!
thank you so much sir freshers needs you keep it up sir 😊😊
@CodingLabYT
Жыл бұрын
Most welcome
Behtareen 👌 Tutorial. Is channel pa or be ziyada content daloo. Thank you
@iUmerFarooq
3 жыл бұрын
@@CodingLabYT Acha ❤️
@CodingLabYT
3 жыл бұрын
Okk.. Video dekhte rehena.
I really learned a lot from this.
@CodingLabYT
3 жыл бұрын
Glad to hear. Regards
The way you this video is great .. Thanks 🥰🥰🥰
@CodingLabYT
2 жыл бұрын
Glad you liked it!
Boht badiya bhai
@CodingLabYT
2 жыл бұрын
Glad you like. Best regards!!
Thanku so much sir u are giving us good knowledge and best content love u sir
@CodingLabYT
3 жыл бұрын
Always welcome my friend 😊❤️
Thank you so much....
thank you so much...............
I loved this, but can you show how to make the scroll is locked when the nav menu is open on mobile? Also, how would I do if I click on one element of the navbar and close the menu as it scrolls right to the div I want? Thank you for this content, I'm learning a lot with you. Best 👌
@CodingLabYT
3 жыл бұрын
Watch this for you solution kzread.info/dash/bejne/h3yHx6ixiqzbpps.html
Thanks bro. helped a lot .
@CodingLabYT
2 жыл бұрын
Glad it helped
brilliant work
I don't understand your language, but thank you for sharing your knowledge! It was really helpful
@CodingLabYT
2 жыл бұрын
Glad to hear that
Thank you so much for your help....
@CodingLabYT
Жыл бұрын
Glad it helped
Thanks alot very nice explanation.
@CodingLabYT
2 жыл бұрын
Glad you liked it
Great video for beginners 🔥
@CodingLabYT
Жыл бұрын
Glad you liked it
Helpful video, Thanks.
@CodingLabYT
3 жыл бұрын
Thank you for liking the Video
really nice
Thank you sir it realy helped me
@CodingLabYT
2 жыл бұрын
Happy to help
your explanation skills are next level !!!
@CodingLabYT
2 жыл бұрын
Glad you like them!
very nice and clear explanation. Thank you
@CodingLabYT
2 жыл бұрын
Glad it was helpful!
thank you so much
Great ♥️
Thank you so so much, man, you really help me out of a huge problem hahahah thanks
@CodingLabYT
3 жыл бұрын
Always welcome bro❤️😊
amazing bro!! big fan of you!!
@CodingLabYT
3 жыл бұрын
Thank you bro ♥️😊
tq so much bro
Thank you so much you're the best♥️♥️♥️
@CodingLabYT
Жыл бұрын
You're welcome!
Thanks, good explanation
@CodingLabYT
3 жыл бұрын
Thank you 💙😁
Hum ise media queries mein likha ke sidha likh sakte hai
very helpful video thanx sir
@CodingLabYT
2 жыл бұрын
Most welcome
Thanks sir❤😊