initial commit

1 files changed, 60 insertions, 0 deletions

diff --git a/files/de/web/css/background-origin/index.html b/files/de/web/css/background-origin/index.html
new file mode 100644
index 0000000000..694b12b3e4
--- /dev/null
+++ b/files/de/web/css/background-origin/index.html
@@ -0,0 +1,60 @@
+---
+title: background-origin
+slug: Web/CSS/background-origin
+tags:
+  - CSS
+  - CSS Referenz
+translation_of: Web/CSS/background-origin
+---
+<p>{{ CSSRef() }}</p>
+<h3 id="Übersicht">Übersicht</h3>
+<p>Die <code>background-origin</code> Eigenschaft legt den Bereich des Hintergrundbildes fest (bzw. den Ausgangspunkt eines <a href="/de/CSS/background-image" title="de/CSS/background-image"><code>background-image</code></a>). <code>background-origin</code> hat keinen Effekt, wenn <a href="/de/CSS/background-attachment" title="de/CSS/background-attachment"><code>background-attachment</code></a> auf <code>fixed</code> gesetzt wurde. Es können mehrere Werte (durch Kommata getrennt) definiert werden, um unterschiedliche Einstellungen für mehrere Hintergrundbilder festzulegen.</p>
+<p>Die Eigenschaft <code>-moz-background-origin</code> wird bis einschließlich Gecko 1.9.2 (Firefox 3.6) unterstützt.</p>
+<p> </p>
+<div class="note"><strong>Hinweis</strong>: Um ältere und neuere Versionen von Gecko (Firefox) zu unterstützen, sollten Sie beide Eigenschaften (mit und ohne <code>-moz-</code>) im Stylesheet notieren. Siehe <a href="/de/CSS/background-origin#Beispiele" title="de/CSS/background-origin#Beispiele">Beispiele</a>.</div>
+<p>Der Wert dieser Eigenschaft wird durch die Kurzformeigenschaft <a href="/de/CSS/background" title="de/CSS/background"><code>background</code></a> auf den Standardwert (<code>padding-box</code>) zurückgesetzt.</p>
+<ul> <li>Standardwert: <code>padding-box</code></li> <li>Anwendbar auf: alle Elemente</li> <li>Vererbbar: Nein</li> <li>Prozentwerte: Nein</li> <li>Medium: visuell</li> <li>berechneter Wert: wie festgelegt</li>
+</ul>
+<h3 id="Syntax">Syntax</h3>
+<pre class="eval">/* seit Gecko 2.0 (Firefox 4.0) */
+background-origin: [padding-box | border-box | content-box][, [border-box | padding-box | content-box]]*
+
+/* ältere Versionen (mehrere Hintergründe seit Gecko 1.9.2 / Firefox 3.6) */
+-moz-background-origin: [padding | border | content][, [border | padding | content]]*
+</pre>
+<h3 id="Werte">Werte</h3>
+<dl> <dt>padding-box {{ gecko_minversion_inline("2.0") }} bzw. padding <small>(Firefox 1.0-3.6)</small></dt> <dd>Standardwert. Die Hintergrundposition ist relativ zum <code>padding</code>. (Für einzelne Boxen ist "<code>0 0</code>" die obere linke Ecke der <em>padding edge</em> und "<code>100% 100%</code>" ist die untere rechte Ecke.)</dd> <dt>border-box {{ gecko_minversion_inline("2.0") }} bzw. border <small>(Firefox 1.0-3.6)</small></dt> <dd>Die Hintergrundposition ist relativ zum Rahmen (<code>border</code>), sodass sich das Hintergrundbild hinter dem Rahmen befinden kann.</dd> <dt>content-box {{ gecko_minversion_inline("2.0") }} bzw. content <small>(Firefox 1.0-3.6)</small></dt> <dd>Die Hintergrundposition ist relativ zum Inhalt.</dd>
+</dl>
+<h3 id="Beispiele">Beispiele</h3>
+<h4 id="Hintergrundbild_im_padding-Bereich">Hintergrundbild im padding-Bereich</h4>
+<pre> .example {
+   border: 10px double;
+   padding: 10px;
+   background: url('image.jpg');
+   background-position: center left;
+   -moz-background-origin: content;          /* Firefox 1.0-3.6 */
+   -webkit-background-origin: content-box;   /* Safari, Chrome */
+           background-origin: content-box;   /* Firefox 4.0+ */
+}
+</pre>
+<h4 id="Mehrere_Hintergrundbilder_gecko_minversion_inline(1.9.2)">Mehrere Hintergrundbilder {{ gecko_minversion_inline("1.9.2") }}</h4>
+<pre>div {
+  background-image: url('mainback.png'), url('logo.jpg');
+  background-position: 0px 0px, top right;
+  -moz-background-origin: padding, content;
+  -webkit-background-origin: padding-box, content-box;
+          background-origin: padding-box, content-box;
+}
+</pre>
+<h3 id="Browser_Kompatibilität">Browser Kompatibilität</h3>
+<table class="standard-table"> <tbody> <tr> <th>Browser</th> <th>ab Version</th> <th>Unterstützung von</th> </tr> <tr> <td>Internet Explorer</td> <td>---</td> <td>--- [*]</td> </tr> <tr> <td rowspan="2">Firefox (Gecko)</td> <td>1.0-3.6 (1.2-1.9.2)</td> <td><code>-moz-background-origin: padding | border | content</code></td> </tr> <tr> <td>4.0 (1.9.3)</td> <td><code>background-origin: padding-box | border-box | content-box</code></td> </tr> <tr> <td>Opera</td> <td>10.5</td> <td><code>background-origin: padding-box | border-box | content-box</code></td> </tr> <tr> <td>Safari (WebKit)</td> <td>3.0 (522)</td> <td><code>-webkit-background-origin: padding | border | content </code><br> <code>-webkit-background-origin: padding-box | border-box | content-box</code></td> </tr> </tbody>
+</table>
+<ul> <li>[*]: Der Standardwert ist bis einschließlich IE7 <code>border-box</code>.</li> <li>Der IE8 kennt <code>padding-box</code> als Standard.</li> <li>Konqueror 3.5.4 unterstützt <code>-khtml-background-origin</code>.</li>
+</ul>
+<h3 id="Spezifikation">Spezifikation</h3>
+<ul> <li><a class="external" href="http://www.w3.org/TR/css3-background/#background-origin" lang="en">CSS 3 Backgrounds and Borders #background-origin</a> <br> (Standardisiert sind <code>padding-box</code>, <code>border-box</code>, und <code>content-box</code>)</li>
+</ul>
+<h3 id="Siehe_auch">Siehe auch</h3>
+<ul> <li><a href="/de/CSS/background" title="de/CSS/background"><code>background</code></a>, <a href="/de/CSS/background-attachment" title="de/CSS/background-attachment"><code>background-attachment</code></a>, <a href="/de/CSS/background-color" title="de/CSS/background-color"><code>background-color</code></a>, <a href="/de/CSS/background-clip" title="de/CSS/background-clip"><code>background-clip</code></a>, <a href="/de/CSS/background-image" title="de/CSS/background-image"><code>background-image</code></a>, <a href="/de/CSS/background-position" title="de/CSS/background-position"><code>background-position</code></a>, <a href="/de/CSS/background-repeat" title="de/CSS/background-repeat"><code>background-repeat</code></a>, <a href="/de/CSS/background-size" title="de/CSS/background-size"><code>background-size</code></a></li> <li><a href="/de/CSS/-moz-background-inline-policy" title="de/CSS/-moz-background-inline-policy"><code>-moz-background-inline-policy</code></a></li>
+</ul>
+<p>{{ languages( { "en": "en/CSS/background-origin", "fr": "fr/CSS/-moz-background-origin", "ja": "ja/CSS/-moz-background-origin", "pl": "pl/CSS/-moz-background-origin" } ) }}</p>