blob: 551703c7da6901edbf5eaf4e466bf32fd22c409d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
---
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>
|
