@AlexPlusPlus

Как верстать и какие принципы использовать для верстки лендинга с full height фоном?

Предположим, есть фон, представляющий собой сплошную картинку, к примеру, 4000px высотой. Интересует верстка подобного лендинга, с технически правильным подходом. Интересует, как позиционируются элементы относительно фона-картинки (абсолютом или фон режется и как-то раскидывается по контейнерам)
  • Вопрос задан
  • 243 просмотра
Решения вопроса 1
ShadowOfCasper
@ShadowOfCasper
Middle User Interface Web Developer
background-image, если тебе нужен простофон.
background-size: cover;
background-position: center;
Если нужно именно зафиксить фоном, ещё какой-нибудь параллакс добавить на картинку, то лучше всего создать section и положить туда 2 блока - первый relative с z-index: 1, второй fixed с z-index: -1, на fixed кидаем background-image с указанными выше свойствами и height:100vh или 100%. Если нужен параллакс, то width и height увеличиваем - 100% + планируемый оффсет параллакса.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы