Назад к списку задач

Работа с позиционированием. Абсолютное и относительное

Уровень: Начинающий

Задача по HTML и CSS: работа с абсолютным и относительным позиционированием в CSS.

Файлы задания

Скачайте файлы задания и создайте композицию, которую вы видите на изображении, используя относительное и абсолютное позиционирование, а так же z-index. После выполнения сравните с результатом.

  1. Размер композиции 600x400
  2. Фон композиции вставьте через CSS
  3. Каждый элемент композиции - это картинка (img), которую нужно расположить в нужную позицию относительно композиции. Используйте классы и стилизуйте их
  4. Попробуйте подобрать примерно похожие значения позиций элементов

Результат

See the Pen Работа с позиционированием. Часть 1 by Dmitry Valak (@dmitryvalak) on CodePen.


Назад к списку задач

Если хотите поделиться своим решением, используйте сайты типа codepen.io и оставляйте ссылку в комментарии

Обсуждение (3)

Войдите или зарегистрируйтесь для того чтобы оставлять комментарии


Sergii
https://codepen.io/sergii_tytarenko/pen/WNQOgNK
Denis
https://codepen.io/cameronhoff/pen/eYdPGwX
KolyNone
https://codepen.io/kolynone/pen/xxdPraz как же это было трудно я пытался подобрать так чтоб было похоже потом 2 часа возился с фото чтоб смог загрузить в код пен но это для меня был хороший опыт также
получил опыт git hub)