Каталог
Веб-разработка с нуля: четыре курса по порядку.
HTML, затем CSS, JavaScript и SQL. Каждый курс говорит, что нужно знать до него и что вы будете уметь после.
Загружаем курсы…
Каталог
HTML, затем CSS, JavaScript и SQL. Каждый курс говорит, что нужно знать до него и что вы будете уметь после.
Загружаем курсы…
Урок 27 из 53 · 12 мин
Собираем адаптивную шапку: логотип, меню, кнопка брони.
Логотип слева, меню посередине, кнопка «Войти» справа. На узком экране всё переносится.
Шапка — классика Flexbox. Три шага.
header: флекс, align-items: center, gap: 24px, padding: 16px 24px.
Пусть nav растягивается (flex: 1), а шапка переносится на узком экране (flex-wrap: wrap).
.cta: фон #6b3e26, белый текст, padding: 10px 20px, border-radius: 999px, без подчёркивания.
Выберите один ответ.
Что позволит шапке аккуратно переноситься на узком экране?
Соберите шапку .header на Flexbox: логотип слева, кнопка справа, меню между ними, всё выровнено по центру по вертикали. У меню .menu — тоже Flexbox с промежутками между ссылками.
Что проверим:
Проверяем состояние обучения…