YoVDO

How to Build a Responsive Navigation Bar with Flexbox

Offered By: Envato Tuts+ via YouTube

Tags

Flexbox Courses Web Development Courses Responsive Web Design Courses

Course Description

Overview

Dive into a practical 31-minute video tutorial on creating a mobile-first, responsive navigation bar using flexbox. Learn to craft a toggleable menu with distinct layouts for mobile, tablet, and desktop screens. Master the process of structuring HTML, applying basic styles, implementing mobile navigation, styling submenus, integrating Font Awesome icons, adding toggle and dropdown functionalities, and designing tablet and desktop menu versions. Gain hands-on experience in modern web design techniques while building a versatile navigation component adaptable to various screen sizes.

Syllabus

Intro
The Markup
Let's Add Some Basic Styling
Let's Create the Mobile Navigation
Let's Style the Submenus
Font Awesome
Let's Add the Toggle Functionality
Let's Add the Dropdown Functionality
Let's Create the Tablet Menu
Let's Create the Desktop Menu


Taught by

Envato Tuts+

Related Courses

Advanced CSS Concepts
Microsoft via edX
Тонкости верстки
Moscow Institute of Physics and Technology via Coursera
CSS - The Complete Guide 2024 (incl. Flexbox, Grid & Sass)
Udemy
Build Responsive Real-World Websites with HTML and CSS
Udemy
HTML5 & CSS3 Build: Two Responsive Websites in Hindi
Udemy