background-size: cover
в CSS это свойство, которое устанавливает размер фонового изображения элемента так, чтобы оно полностью покрывало всю видимую область элемента, при этом сохраняя пропорции изображения.
Например, следующий CSS код устанавливает фоновое изображение для элемента div
и устанавливает свойство background-size: cover
, чтобы изображение полностью покрыло элемент и сохраняло пропорции:
div {
background-image: url('image.jpg');
background-size: cover;
}
Здесь мы используем свойство background-image
для установки фонового изображения, а свойство background-size: cover
для указания полного покрытия элемента изображением.
background-size
может принимать различные значения, например:
auto
: размеры фонового изображения устанавливаются автоматически, так чтобы изображение имело свои оригинальные размеры.contain
: размеры фонового изображения устанавливаются таким образом, чтобы оно было полностью видимо, однако может оставаться пустое пространство на вертикальных или горизонтальных границах, которые не заполняются.cover
: размеры фонового изображения устанавливаются таким образом, чтобы оно полностью покрывало область элемента без изменения своих пропорций.
background-size
может быть использовано для создания различных эффектов дизайна, таких как масштабирование фоновой картинки на элементе, подгонка изображения под размеры экрана и др.