How To Make Drop Down Menu Using HTML And CSS | HTML Website Tutorials
Вставка
- Опубліковано 12 вер 2024
- Learn How To Make Drop Down Menu Using HTML And CSS. HTML Website Development Tutorial for beginners.
❤️ SUBSCRIBE: goo.gl/tTFmPb
❤️ Complete website Using HTML and CSS
✔️ 8 Complete website step by step
✔️ Source Code Download
✔️ 76 Lectures, 12 Hours Video
✔️ Course Completion certificate
👉 easytutorialsp...
In this video you will learn to create Drop down menu in navigation bar with icons using HTML and CSS.
#DropDownMenu #WebDevelopment #WebDesign #HTMLTutorials
You may also like below tutorial to create Full website:
Create Business Website Tutorial: • How To Make Website Us...
Create Fitness Website Tutorial: • How To Make A Website ...
Create Personal Resume Website: • How To Make A Website ...
Digital Agency Website Tutorial: • How To Make A Website ...
Job Portal Website Tutorial: • How To Make Website Us...
E-commerce Website Tutorial: • Create Ecommerce Websi...
-------------------------------------
Best hosting up to 60% off (coupon- EASYTUTORIALS)
👉 easytutorialsp...
Affordable hosting up to 91% (coupon- EASYTUTORIALS)
👉 easytutorialsp...
My recommended tools and tutorials
👉 easytutorialsp...
-------------------------------------
Join my channel membership and get all my new video's codes in community post:
Join Link: / @greatstackdev
-------------------------------------
Like - Follow & Subscribe us:
► UA-cam: goo.gl/tTFmPb
► Facebook: goo.gl/qv7tEQ
► Twitter: / itsavinashkr
If you encounter problems you probably need to recheck your html code as for example, I was having problems with the first dropdown menu, the issue was that the was placed wrongly, you can take a look where the was before and after (11:05 - 12:09). after he added those lines of code I still thought that the was at line 11 but it actually was at line 19. check your html and look check so att everything is as the code that he has!
👏
THANK YOU SO MUCH!!!!
Hover And After CSS is not working in my vs code while enabled. Please guide me.
Follow on Instagram: instagram.com/iamavinashkr/
Sir please upload on github
THANKS FOR HELP .......MONEY MAKERS......
Man you saved me hours of work , i was trying to figure out what am I doing wrong when adding submenus , ive created a home page with designed buttons and everything aleady and i didnt want to delete it and rewrite the whole content , now you shown me how i easily add those submenus into my buttons and what i need to change in my css code , thanx you a legend
Me also
👉 Join on Telegram: t.me/greatstackdev
Sir, please explain how to select and position nested ul and li
oka
I wish I had a teacher like you at college. I'm sure will be visiting your channel quite often the next years. Thank you so terribly much.
Thanks to you bro
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Very calm and confident explanation of your process.
Would like to see a follow up with how to tune this for mobile phones and tablets - I think that would be very helpful. Thank you!
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
Same here...
The only thing about some images is you may need to try a different positioning value when I tried background image center it was to small, but I fixed it to position absolute and it worked perfectly very good so far though.
There's never ever, an absolute. Turns off - power grids. Or drops, web cams.
thank you man you ,i was also trying to figure out how to position image
thanks it works
LOVING THIS! So simple, yet elegant! A beginner like me got it.
So many ways to style your navigation!
Saw all from Easy tutorials!
hlo can you send me the code
Hi! I'm Korean. Thank you so much!! Your video is useful and easy:) You are my best teacher👍
I'd love to see part two making it mobile friendly with media queries
It is helpful video Thanks 😍
Where do I get the part two video with media queries?
@@DEEPAKMISHRA-km9uu ua-cam.com/video/WZ5lRnTbSpI/v-deo.html
What is media queries
@@jyotigupta08 media query is used for making the website to be responsive i.e it will make the website to look good in computer and as well as in phone
I watched some videos for you to make a website and I saw that you are perfect
God bless
Thanks Buddy for such an interesting project, really loved making every bit of it. God Bless U and please keep adding such interesting and challenging projects for the to be web developers. ..
Color hunt app
play.google.com/store/apps/details?id=com.whitewolf.colorhunt
hy
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
আমার কাছে এই টিউটোরিয়ালটা অনেক ভালো লেগেছে। কেননা আমি অনেক ভিডিও টিউটোরিয়াল দেখেছি যেখানে অনেক অতিরিক্ত কথা বলা হয়। কিন্তু এই টিউটোরিয়ালটিতে অতিরিক্ত একটি কথা ও বলা হয়নি, এটা খুবই চমৎকার !আপনার জন্য শুভকামনা এগিয়ে যান।
Woah this one was super perfect!!!!!!!!! I could clearly got all the points!!! Thank you for encouraging me to carry on my digital journey!!! Best of luck for all your endeavors!!!!! 😌💕
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
Well enough to make my project "Shine"..! Thank You. Peace :)
same here
Why r u gay?
I can't wait to press like button. Thank you are awesome
Your methods are excellent. You are an excellent instructor. Your instructions is consistent and logically well structured.. Thank you,
I decided to share my knowledge as well can you check it out
Which editor is best for CSS , HTML , Java , can you explain it ? Pls sir want complete video on text editors
VS Code is best, but i use brackets it looks simple that is good for my video
I liked for this video and i say keep going my friend✅✅✅✅👏👏👏👏👏
Dope tutorial, helped me out alot! Thank you.
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
I 'm glad I found your tutorial video, I started learning on Html,Css a month ago this is very helpful on my learning, Thank you so much for sharing your knowledge and the videos. very appreciated!
same to u
Same here any ideas I don't seem to put two things together
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
can u help me creating attendance website
Hello i have question what is better this drop down menu or tag ?
Brilliant video, Thank you for posting this video. Really helpful. Spent year long learning CSS. It makes sense.
Glad it was helpful!
well explained, thank you!
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
Can you share the link to the backgraund image
Very informative, very composed tutorial, and definitely something to try out in 2021.
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
This helped me so much! I literally fixed a weeks worth of work in a few hours thanks to this tutorial, thanks so much! I will def be watching more of your videos in the future, keep up the amazing and helpful tutorials! :)
This is an amazing tutorial
More grace bro, I really appreciate
I'm definitely go tell my friends about your channel
Glad to hear that. Thank you so much! 😊
Thank You Soo Much Appreciate Your efforts Towards Uss 🙏
Help Me A Lot
Thank you for that design .. really helped me to start my project
Thank you for this lesson. This is exactly what I was looking for - Rehman
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
The easiest and best video l have ever found in UA-cam for beginners to learn about html and css ...lots of respect to u bro🍀🍀
Hi can I get the source code please
Thanks it has really helped so much 😊 on our projects
Nice tutorial, it's so helpful,
Thank you for this video!
I decided to share my knowledge as well can you check it out
Thanks for the very helpful tutorial. How do you link the the dropdown links to a page within the website?
Same question
hello!
I have a question...
What resolution is this background image from your website?
1920x1080
yr bhai i am searching this for three days so finally i was see your lec and it is very helpful for me lots of love from pakistan.
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
you have the best web design tutorials i've ever seen. thank you for the knowledge and i wish you the best of luck!
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
I know that you visit here because of school 😂😂
Ye kis school me hota be
Yes brother you are right
Bro im in college 😒
😂sure
I'm here bcoz of the views 3.2m🔥 1:21
Thanks a lot! I cant express in words how much thankful I am to you for this amazing, easy conceptual video.You have covered a very important concept in CSS .
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Wow, nice that my left ear learns 2% more then my right ear!
Sir, I have one doubt. At 14:56, you change the color of the text when you hover. WHATEVER I do, it WOULD NOT change the color. Please help.
in the CSS of "news-container" we can add one more property , So that the overflow of X-axis can be hidden,
.news-container
{
overflow: hidden ;
}
Thank you, for your code that you have been coded to form a drop down menu.
super
Thank you
I have a problem always is chasing me for not showing any background images even though the path of the image is right.
yes i have too background image not showing
Which editor you are using ? I am using notepad++
It's brackets Editor, you can download here: brackets.en.softonic.com/download
Here is the video for brackets editor shortcut keys: ua-cam.com/video/88Xb1fhst2I/v-deo.html
@@GreatStackDev thankyou sir
@@GreatStackDev I am using windows 7 32 bit , will it support ?
Sir Drop-down menu me kuch animation add karna ho to fir kya kare animation jaise jab menu par click kare to submenu 3D type se aye ya niche se page upar aye aisa
jaise is video me, button click par transform: scale(); lagya hai maine
waise hi menu click par transform: translateY(); apply kar lo
your content is so informative however there's a lot of ads on your channel.
Hv you try above code...lol
😂😂😂😂
11:37 so I can re-watch it again lol.
Hahahha same
Thanks i was looking for that comment haha
What you guys mean?
@@amongdoomers9464 main part start from there.
pls how can i get the background u use for the tutorial.
pexels.com
Thank you so much, You just saved my protect ! Hope you reach 100k subs soon!
Thank you so much, please visit our channel for more videos: ua-cam.com/channels/kjoHfkLEy7ZT4bA2myJ8xA.htmlvideos
Well enough to make my project "Shine"..! Thank You. Peace :)
love you sir
Thanks Boss
done before internet connection & other's video tutorials in the easiest way
Sir. Iam app create idea
Electrical service app
Please information sir
🔥🔥🔥
* { } From where this tag came,
And what does it mean
click ALT + 0123
It is the selector which is known as star selector whatever style you apply in this selector applies to whole HTML page
Awesome. Very much interested to learn about HTML & CSS . I have tried parallelly got good looking website. Thank You so much. Keep it up.
tooo much qawsome way that how u going slowly every step clear to build this webpage.......an awsome platform is here you show how to learn to codes nd build webpage to an unknowing coding bigginner ....thnkuuuuu sir a lot
Thanks Reena, Even i have a better video for beginners, after watching that it would be easier to understand my all videos: ua-cam.com/video/GAZVvpjxYQY/v-deo.html
I am always in love with ur tutorials, good work boos 🥰😍🤩
Thank you so much 🤗
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
donno but my left headphone just banged 💣
i had a jumpscare out of that, it's like someone was behind me oof
Thank u now i understand codes that ive been copying online
Thank you so much. I learnt a lot watching this video. Good explanation. You are a good teacher
Thank you. It is very important and very nice video.
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Bro thank you very much because I have learned how to make dropdown box only through you inspite I am 14 years old✌✌👍👍👍👍
Keep it up
I have watched plenty of videos but got no idea you really did good job👍🏻
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
This video had very usefull for me....
The best video ever...thank you so much for amazing video😊
Very smart...you are so loud and clear. You deserve a credit.
Thanks.
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Perfect lesson sir!! You made by day Thank you and keep it up!!❤❤
I decided to share my knowledge as well can you check it out
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Thanks a lot.. I'm everyday searching and searching abouts same this vedio. But i got it's finally. Thank you so much brother...
thaaaank you open my eyes to build my own website your are great
Glad I could help..!
I like all this video, Every video is very helpful for everybody am hope.
Glad to hear that
This video helped me a lot! thank U =]
Thanks to you for comment
Great video, but maybe you should explain a little about why you're doing what you're doing when you're doing it.
Otherwise, we're not understanding the WHY which is most important when we want to take what we learned here and apply it to a different project. I was able to follow along easily with this video, but when I wanted to add a dropdown menu to something else, I didn't know how really.
Without explaining why we're just basically copying code and typing it out without understanding really why we're doing it.
I am new in your channel it is great for me Love this
WOW, Thank you so much for this, i'd learn a lot from your video.
Hello bro. Please my background image doesn’t fit the screen. Anything I can do ? Help a brother from Nigeria
your method of teaching is very nice you are good teacher....
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Thank you ! It was so easy to follow along with and understand. 😃
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
today i sawed this video and amazed more, thanks for your great support thank you so much.
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
It was really awesome... and made easy.
Will it work as responsive design?
This one better than othet UA-cam videos for learning purpose! Because here you are doing it step by step!
That's why I learning from you videos but one think I would request you!
How can I arrange the website content like first menu-bar wll come then a Welcome text then slider photo will come then products pictures with heading then next page option.
So can you tell me how to arrange these!
i'm clear about drop down menu. Thank you
I really enjoy your channel and you are a good teacher. I might have missed sotNice tutorialng and I don't get friends with the setuper. I worked
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Really well explained and a very good guide for beginners...👍👌
can u help me creating attendance webpage?
u are the only one who saved my code thank u so much
Thank you to help us, making this types of contents. Hi, I am learning website design. Please make a video on how to link about pages and other pages with one another.
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
Thanks for part one, I wanted to finish up to part two. Is it coming soon?
It's great !, is it complicated to make drop down items work as selectable ?
I decided to share my knowledge as well can you check it out
really superb bro i struggled to add image as background and now i felt easy. thank you! but drop down options are right side for me i gave input as left only
Your videos are extremely helpful. Thank you so much.
When I heard that ascent I got an attitude but after viewing the whole video, much respect
much love...!
why would you get an attitude to begin with lol
@@vengeancegq6ro people dont like indians
Thanks bro I invested my 3-4 hours in it writting side by side on my laptop thankq this was my first Website menu. 😘
That's what I was searching for
Thanks for your comment
Please tell me How U make second sub
@@GreatStackDev ☺️🙃
Thank you so much for sharing your idea. This lesson was extremely helpful
My friends, search for your life purpose, why are we here?? I advise you to watch this series 👇 as a beginning to know the purpose of your existence in this life.
ua-cam.com/play/PLPqH38Ki1fy3EB-8xmShVqpbQw99Do2B-.html
One of the best videos I had watched that you sir
Thanks 🙏 a lot you are best teacher of web developing
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
wow this guide is so gud for those who are commerceing with webdesigning
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
nice video.
Very educative
I am finding it difficult to input the icons.
Best tutorial I've seen on dropdown menus. Thanks for posting
animated Box With CSS
ua-cam.com/video/gBmx3RmThDE/v-deo.html
a lot of thanks to your videos for a begginner and pro.a super thanks..worth.managed well as you have given images links