Задать вопрос
@AlexPlusPlus
html

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

Предположим, есть фон, представляющий собой сплошную картинку, к примеру, 4000px высотой. Интересует верстка подобного лендинга, с технически правильным подходом. Интересует, как позиционируются элементы относительно фона-картинки (абсолютом или фон режется и как-то раскидывается по контейнерам)
  • Вопрос задан
  • 280 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 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% + планируемый оффсет параллакса.
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Разработать парсер
26 апр. 2024, в 07:47
2000 руб./за проект
Devops для видео сервиса
26 апр. 2024, в 06:46
1000 руб./в час
Найти ошибку flutter_map
26 апр. 2024, в 05:31
1000 руб./за проект
Ещё заказы