Guest
🎯 Загружено автоматически через бота: 🚫 Оригинал видео: 📺 Данное видео является собственностью канала Александр Ламков — Friendly Frontend. Оно представлено в нашем сообществе исключительно в информационных, научных, образовательных или культурных целях. Наше сообщество не утверждает никаких прав на данное видео. Пожалуйста, поддержите автора, посетив его оригинальный канал: @AleksanderLamkov. ✉️ Если у вас есть претензии к авторским правам на данное видео, пожалуйста, свяжитесь с нами по почте support@, и мы немедленно удалим его. 📃 Оригинальное описание: ✏️ Продолжаем верстать лендинг с того же момента, на котором остановились в прошлый раз. Ранее мы проанализировали макет, подключили к проекту нестандартные шрифты, добавили нормализацию стилей, составили набор глобальных переменных в root-селекторе, добавили немного стилей для `body` и утилитарного класса `container`, ну и в конце концов — сверстали десктопную версию шапки и адаптировали её под узкие экраны мобильных устройств. В этот раз — займемся секцией `banner`. 🔴 Timeline: ▶ 00:00 | Вступление ▶ 00:28 | Доработка header — фоновый цвет ▶ 00:55 | Доработка header-menu-link — свойство aspect-ratio ▶ 01:22 | Доработка header-burger-button — свойство aspect-ratio ▶ 01:30 | Доработка header-burger-button — UX и доступность, класс visually-hidden ▶ 03:53 | Разметка main ▶ 04:03 | Разметка секции banner, ч. 1 ▶ 05:07 | Правила работы с заголовками ▶ 06:51 | Разметка секции banner, ч. 2 ▶ 11:10 | Стилизация секции banner ▶ 21:29 | Адаптация секции banner 📚 Ссылки: ➖ Макет Kropp Fitness в Figma: -Free-Web-UI-designs-(Community)?type=design&node-id=0:1&mode=design&t=CzUspvuV0m0Mn8KA-1 ➖ Репозиторий с кодом проекта: ➖ Статья htmlacademy “Как прятать“ (утилитарный класс visually-hidden): ➖ Форматы времени в атрибуте datetime для тега time: 💬 Чат в телеграмме (помощь новичкам): 🔸 Boosty (поддержать канал): 🗂️ Бесплатные курсы на канале: 🟠 HTML: 🔵 CSS: 🟡 JS: 🟢 A11y: ⚪️ Мастер-класс по верстке для новичков: 🔘 Мастер-класс по верстке для продвинутых (БЭМ, SCSS): 🗺 Frontend Roadmap 2024 📌 Автор: ➖ Личный сайт: ➖ Telegram: ➖ Boosty: ➖ GetMentor: ➖ Solvery: #frontend #фронтенд #верстка #версткасайтов
