Урок 5

Практика: навигационное меню

25 мин

Навигационное меню — идеальный пример использования Flexbox. Создадим несколько вариантов от простого к сложному.

Простая навигация

Базовое меню с ссылками в ряд:

Навигация с логотипом

Логотип слева, ссылки справа с помощью margin-left: auto:

Навигация с выпадающим меню

Добавим подменю с помощью вложенного flex:

Мобильная навигация (бургер)

Адаптивная навигация для мобильных устройств:

Мы используем файлы cookie для улучшения работы сайта и персонализации контента. Продолжая использовать сайт, вы соглашаетесь с использованием cookies в соответствии с нашей Политикой конфиденциальности.