Как работает свойство background-size: contain в CSS?

Свойство background-size: contain в CSS масштабирует фоновое изображение так, чтобы оно полностью заполняло контейнер или всю страницу. 1

Уменьшение или увеличение происходит пропорционально до тех пор, пока высота или ширина не будет выходить за рамки контейнера. 1

Таким образом, фон страницы будет автоматически подгоняться под любое разрешение. 1

Однако возможно оставление пустых областей с двух сторон элемента, так как при использовании значения contain картинка вписывается в блок с сохранением пропорций, а не обрезается. 45