Свойство background-position в CSS

расположение фонового изображения

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

Примеры

.cat {
    background-position: left top;
    background-position: 10% 70%;
    background-position: right 10px bottom 20px;
    background-position: left top, right bottom;
}

Значения

Значение Описание
left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom
Одно или два ключевых слова, определяющих положение.

После ключевого слова может идти значение смещения от этого края в единицах измерения. Например: right 20px.

Если задано только одно — второе будет по умолчанию center.

x% y% Горизонтальная и вертикальная позиция в процентах.
Если задано только одно значение — второе будет равно 50%.
X Y Горизонтальная и вертикальная позиция в единицах измерения CSS. Например: 10px 50px.
Если задано только одно значение — второе будет равно 50%.
inherit Наследует значение родительского блока.
initial Устанавливает значение по умолчанию.

Поддержка браузерами

НастольныеМобильные
Chrome
Edge
Firefox
IE
Opera
Safari
Chrome
Firefox
Opera
Safari
Samsung
Android
background-position
1
12
1
4
3.5
1
18
4
14
1
1.0
≤37
Несколько фонов
1
12
3.6
9
10.5
1.3
18
4
14
1
1.0
≤37
4 значения
25
12
13
9
10.5
7
25
14
14
7
1.5
≤37
Поддерживается: Да
Получай полезные материалы удобным способом!
Добавить комментарий