Html: Футуристический плакат

CSS: Grid 5 сообщений
23
Студента
60%
Завершения
Обновлено: 09 июня, 19:59

Реализуйте футуристический плакат представленный на макете

Футуристический плакат на CSS

Основные стили

Плакат

  • Сетка состоит из 6 колонок и 6 строк с автоматическим размером
  • Плакат выровнен по центру на странице
  • Ширина плаката: 980px
  • Высота плаката: на всю высоту viewport
  • Цвет каждой ячейки: #15141c
  • Ячейки, накладывающиеся на изображение имеют цвет #673ab7 и прозрачность со значением 60%.

Заголовок первого уровня

  • Заголовок первого уровня «The Future Is Now» занимает ширину трёх ячеек
  • Размер шрифта: 4em
  • Внутренние отступы: 50 пикселей слева и справа

Заголовок второго уровня Hexlet

  • Размер шрифта: 2em

Изображение и шрифт вы найдёте в директории assets. Для фонового изображения используйте следующие стили:

background-position-x: center;
background-size: cover;

Подключите шрифт Roboto в файле app.css

Сетка готового макета выглядит следующим образом:

Сетка футуристического плаката

Для полного доступа к испытанию нужна профессиональная подписка

Профессиональная подписка откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.

Получить доступ
120
курсов
900
упражнения
2000+
часов теории
3200
тестов