background-origin

Описание

Свойство CSS background-origin определяет положение фонового изображения, заданного с помощью свойства background-image, относительно содержимого и границ элемента.
Если для элемента задано свойство background-attachment со значением fixed, свойство background-origin игнорируется.

background-origin
Значения: border-box | padding-box | content-box
Начальное значение: padding-box
Область применения: все элементы
Наследование: нет
Поддержка браузерами Internet Explorer 9+, Chrome 1+, Opera 10.5+, Safari 3+, Firefox 4+, Android +, iOS +
Версия CSS: CSS3
Синтаксис JavaScript object.style.backgroundOrigin="border-box"
Примечание:

Свойство background-origin поддерживает многослойные фоны и позволяет указывать значения для каджого слоя. Значения в этом случае перечисляются через запятую.

Синтаксис

background-origin: padding-box | border-box | content-box

Значения

Свойство background-origin может принимать следующие значения:

border-box
Фоновое изображение позиционируется относительно границ элемента
padding-box
Фоновое изображение позиционируется относительно отступов элемента
content-box
Фоновое изображение позиционируется относительно содержимого элемента
Opera не поддерживает значение content-box.

Пример

body {
    background-image: url(img.png);
	background-origin: border-box;
}
body {
    background-image: url(img.png);
	background-origin: content-box;
}

Попробовать в DemoPlay

Комментирование запрещено.