291
Студент
64%
Завершения
Термином Hero Section часто описывают заглавный блок сайта или лендинга. Его цель — максимальное выделение ключевой мысли и привлечение внимания в самые первые секунды нахождения пользователя на странице.
В этом испытании вы реализуете один из примеров такой секции:
Макет
Макет для вёрстки расположен на сервисе Figma. Используйте его для определения размера отступов, шрифтов и размера различных элементов. Изображение и шрифты находятся в директории assets.
Базовые настройки макета
- Межстрочный интервал:
2.3. Установите его для<body> - Внутренние отступы у колонок — по 30 пикселей слева и справа
- Внутренние отступы контейнера — по 100 пикселей сверху и снизу
Подсказки
- Определите размер основного контейнера. В этом вам помогут направляющие — вертикальные красные линии
- Задайте горизонтальные внутренние отступы. Здесь тоже можно воспользоваться направляющими
- Задайте вертикальные внутренние отступы. Ориентируйтесь по расстоянию от края макета до слоёв
- Цифры «01» располагаются на 30 пикселей ниже своего изначального месторасположения в потоке документа
- Используйте минимальное количество абсолютного и относительного позиционирования
Для полного доступа к испытанию нужен базовый план
Базовый план откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.