filmov
tv
🎬How To Make Side Navigation Menu Using HTML And CSS | Sidebar Menu Design✨
Показать описание
In today's video, I have created a Side Navigation Bar in HTML CSS, and JavaScript.
I hope you will like this Dashboard Sidebar Menu Design…
______________________________________________________________
🌱💜Support our channel from as little as $1-3 by becoming a Patreon because by doing that, you will help our Channel and also you will have access to 🖥️ Source Code of our videos!
______________________________________________________________
⏱️Chapters:
00:00 Intro
00:37 Creating our Boilerplate
02:05 HTML - Creating Main Div and Menu list using EMMET
04:01 HTML - Nav_Expand Element (Icon)
04:34 CSS - Importing Fonts from Google Fonts
05:10 CSS - CSS Reset (Same Page Across Different Browsers)
05:34 CSS - Styling the Body Tag
06:08 CSS - Styling the Main Div Nav
06:46 CSS - Applying Some Style to the Expandable Icons
08:49 CSS - Still on our Button Increase its Size and Apply Hover Effect
09:33 CSS - Creating our NavList from our LIs
11:49 CSS - Set Some CSS Rules to A tags
13:08 CSS - Creating Active State for the Menus
14:33 CSS - Creating the Closed State Class
15:17 JS - Getting Reference to the DOM Elements
16:19 JS - Add EventListener to the Icon
______________________________________________________________
📚Resources
______________________________________________________________
🏆Recommended Videos🏆
🎬Login & Registration Form Using HTML & CSS & JS✨
🎬How To Create Website With Auto Typing Text Effect Using HTML CSS JavaScript✨
🎬Top 10 CSS & JavaScript Projects✨
🎬Neumorphism Login Form | HTML & CSS✨
🎬Build a Step Progress Bar | JavaScript✨
______________________________________________________________
🛴 Follow me on:
______________________________________________________________
🎵Background Music for Videos:
______________________________________________________________
📨 Business Inquiries: such as Sponsor or Collab.
I hope you will like this Dashboard Sidebar Menu Design…
______________________________________________________________
🌱💜Support our channel from as little as $1-3 by becoming a Patreon because by doing that, you will help our Channel and also you will have access to 🖥️ Source Code of our videos!
______________________________________________________________
⏱️Chapters:
00:00 Intro
00:37 Creating our Boilerplate
02:05 HTML - Creating Main Div and Menu list using EMMET
04:01 HTML - Nav_Expand Element (Icon)
04:34 CSS - Importing Fonts from Google Fonts
05:10 CSS - CSS Reset (Same Page Across Different Browsers)
05:34 CSS - Styling the Body Tag
06:08 CSS - Styling the Main Div Nav
06:46 CSS - Applying Some Style to the Expandable Icons
08:49 CSS - Still on our Button Increase its Size and Apply Hover Effect
09:33 CSS - Creating our NavList from our LIs
11:49 CSS - Set Some CSS Rules to A tags
13:08 CSS - Creating Active State for the Menus
14:33 CSS - Creating the Closed State Class
15:17 JS - Getting Reference to the DOM Elements
16:19 JS - Add EventListener to the Icon
______________________________________________________________
📚Resources
______________________________________________________________
🏆Recommended Videos🏆
🎬Login & Registration Form Using HTML & CSS & JS✨
🎬How To Create Website With Auto Typing Text Effect Using HTML CSS JavaScript✨
🎬Top 10 CSS & JavaScript Projects✨
🎬Neumorphism Login Form | HTML & CSS✨
🎬Build a Step Progress Bar | JavaScript✨
______________________________________________________________
🛴 Follow me on:
______________________________________________________________
🎵Background Music for Videos:
______________________________________________________________
📨 Business Inquiries: such as Sponsor or Collab.
Комментарии