Задает размер фонового изображения или изображений у элемента.
Примеры
background-size: cover;
background-size: 10px;
background-size: 30% 20%;
background-size: 100px auto, 20% auto;
Значения
Значение | Описание |
---|---|
auto | По умолчанию. Фоновое изображение отображается в оригинальном размере. |
размер | Одно или два значения в единицах измерения, например 20px , 10em 5em .Можно задать размеры для нескольких фонов через запятую. Отрицательные значения недопустимы. |
проценты | Устанавливает высоту и ширину фоновой картинки в процентах от размера блока. Если второе значение не задано, оно будет равно auto . |
cover | Фоновая картинка вписывается в блок так, чтобы заполнить его полностью. “Вылезающие” части обрезаются. |
contain | Фоновая картинка вписывается в блок так, чтобы поместиться полностью. При этом она не обрезается. |
inherit | Наследует значение родительского блока. |
initial | Устанавливает значение по умолчанию. |
Поддержка браузерами
НастольныеМобильные
background-size
3
1 -webkit-
12
4
49 -webkit-
3.6-4 -moz-
9
10
15 -webkit-
9.5-15 -o-
5
3 -webkit-
18
18 -webkit-
4
49 -webkit-
10.1
14 -webkit-
10.1-14 -o-
4.2
1 -webkit-
1.0
1.0 -webkit-
2.3
≤37 -webkit-
contain
и cover
3
12
3.6
9
10
5
18
4
14
4.2
1.0
37
Поддерживается: Да Нет