diff options
Diffstat (limited to 'files/de/web/css/-webkit-mask-repeat/index.html')
-rw-r--r-- | files/de/web/css/-webkit-mask-repeat/index.html | 127 |
1 files changed, 127 insertions, 0 deletions
diff --git a/files/de/web/css/-webkit-mask-repeat/index.html b/files/de/web/css/-webkit-mask-repeat/index.html new file mode 100644 index 0000000000..cef03cef91 --- /dev/null +++ b/files/de/web/css/-webkit-mask-repeat/index.html @@ -0,0 +1,127 @@ +--- +title: '-webkit-mask-repeat' +slug: Web/CSS/-webkit-mask-repeat +tags: + - CSS +translation_of: Web/CSS/mask-repeat +--- +<div>{{CSSRef}}{{Non-standard_header}}</div> + +<h2 id="Übersicht">Übersicht</h2> + +<p>Die <code>-webkit-mask-repeat</code> Eigenschaft gibt an, ob und wie ein Maskenbild wiederholt (gekachelt) wird.</p> + +<p>{{cssinfo}}</p> + +<h2 id="Syntax">Syntax</h2> + +<pre class="brush: css">/* Einzelne Schlüsselwortwerte */ +-webkit-mask-repeat: repeat; +-webkit-mask-repeat: repeat-x; +-webkit-mask-repeat: repeat-y; +-webkit-mask-repeat: no-repeat; + +/* Mehrer Schlüsselwortwerte */ +-webkit-mask-repeat: repeat, repeat-x, no-repeat; + +/* Globale Werte */ +-webkit-mask-repeat: inherit; +-webkit-mask-repeat: initial; +-webkit-mask-repeat: unset; +</pre> + +<h2 id="Werte">Werte</h2> + +<dl> + <dt>repeat</dt> + <dd>Das Maskenbild wird horizontal und vertikal wiederholt.</dd> + <dt>repeat-x</dt> + <dd>Das Maskenbild wird nur horizontal wiederholt.</dd> + <dt>repeat-y</dt> + <dd>Das Maskenbild wird nur vertikal wiederholt.</dd> + <dt>no-repeat</dt> + <dd>Das Maskenbild wird nicht wiederholt; nur eine Kopie des Maskenbildes wird gezeichnet. Der Rest des Inhalts des maskierten Elements wird nicht dargestellt.</dd> +</dl> + +<h3 id="Formale_Syntax">Formale Syntax</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Beispiele">Beispiele</h2> + +<pre class="brush: css">.exampleone { + -webkit-mask-image: url('mask.png'); + -webkit-mask-repeat: repeat-x; +} + +.exampletwo { + -webkit-mask-image: url('mask.png'); + -webkit-mask-repeat: no-repeat; +} +</pre> + +<h3 id="Unterstützung_mehrerer_Maskenbilder">Unterstützung mehrerer Maskenbilder</h3> + +<p>Für jedes Maskenbild kann ein unterschiedlicher <code><repeat-style></code> Wert angegeben werden, der durch Kommas getrennt wird:</p> + +<pre class="brush: css">.examplethree { + -webkit-mask-image: url('mask1.png'), url('mask2.png'); + -webkit-mask-repeat: repeat-x, repeat-y; +} +</pre> + +<p>Jedes Bild wird dem zugehörigen Wiederholungsstil zugeordnet, vom zuerst bis zum zuletzt angegebenen.</p> + +<h2 id="Browser_Kompatibilität">Browser Kompatibilität</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Merkmal</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Grundlegende Unterstützung</td> + <td>1.0</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>4.0</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Merkmal</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Grundlegende Unterstützung</td> + <td>2.1</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>3.2</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<p>{{cssxref("-webkit-mask")}}, {{cssxref("-webkit-mask-box-image")}}, {{cssxref("-webkit-mask-clip")}}, {{cssxref("-webkit-mask-origin")}}, {{cssxref("-webkit-mask-attachment")}}, {{cssxref("-webkit-mask-image")}}, {{cssxref("-webkit-mask-composite")}}</p> |