Как сверстать этот background?

Question

[Flexx 97]

Надо сверстать выделенные картинки как бэкграунд, при уменьшении окна браузера они должны обрезаться. Подскажите какие-нибудь статьи по этой теме или по теме background в css в целом. Вообще не представляю как это сверстать

Answer 1

[ReActor Дмитрий Вершанский]

Здравствуйте!
Самое простое - это экспорт всех этих изображений единым слоем. На выходе у вас будет файл .jpg, к примеру, единым изображением, по краям которого необходимая совокупность, а в центре - пустота.

На счет "...обрезаться при уменьшении области просмотра...", то тут нужно уточнить, какова природа этих "обрезаний".

Более длинный путь - это использование мультифона

Comments

[Flexx 97]

На счет "...обрезаться при уменьшении области просмотра...", то тут нужно уточнить, какова природа этих "обрезаний".

когда человек заходит с устройства у которого ширина меньше заданной, то фотографии должны обрезаться

[ReActor Дмитрий Вершанский]

Flexx 97,
Для этих целей используйте медиа-запросы

Пример:

@media screen and (min-width: 320px) and (max-width: 992px) {
   .selector { свойство: значение; }
}

Answer 2

[Den Sabrov]

А зачем именно бэкграундом?