---
title: background-origin
slug: Web/CSS/background-origin
tags:
  - CSS
  - CSS Background
  - CSS Property
translation_of: Web/CSS/background-origin
---
<p>{{ CSSRef() }}</p>

<h2 id="Podsumowanie" name="Podsumowanie">Podsumowanie</h2>

<p>w aplikacjach opartych na Mozilli <code>-moz-background-origin</code> decyduje, który boks wyznacza układ współrzędnych używanych przez wartości własności {{ Cssxref("background-position") }}.</p>

<p><code>background-origin</code> nie stosuje się, gdy własność {{ Cssxref("background-attachment") }} ma wartość <code>fixed</code>.</p>

<ul>
 <li>Wartość początkowa: padding-box</li>
 <li>Dotyczy: wszystkich elementów</li>
 <li>Dziedziczony: nie</li>
</ul>

<p> </p>

<h2 id="Sk.C5.82adnia" name="Sk.C5.82adnia">Składnia</h2>

<pre class="eval">background-origin: border-box | padding-box | content-box
</pre>

<h3 id="Warto.C5.9Bci" name="Warto.C5.9Bci">Wartości</h3>

<dl>
 <dt>border-box</dt>
 <dd>Pozycja tła jest relatywna względem obramowania, zatem obrazek może znaleźć się pod obramowaniem.</dd>
 <dt>padding-box</dt>
 <dd>Pozycja tła jest relatywna względem wypełnienia.</dd>
 <dt>content-box</dt>
 <dd>Pozycja tła jest relatywna względem zawartości.</dd>
</dl>

<h3 id="Przyk.C5.82ady" name="Przyk.C5.82ady">Przykłady</h3>

<pre>hbox.example {
  border: 10px double #000000;
  padding: 10px;
  background: url('image.jpg');
  background-position: center left;
  /* tło będzie wewnątrz padding */
  background-origin: content-box;
}
</pre>