-webkit-mask-repeat

Kein Standard
Diese Funktion entspricht nicht dem Standard und ist nicht Teil der Standardisierung. Diese Funktion darf nicht in Webseiten, die via das Internet zugänglich sind, benutzt werden: Sie wird nicht für alle Nutzer funktionieren. Es kann zu umfangreichen Inkompatibilitäten zwischen verschiedenen Implementierungen kommen und die Funktionsweise oder Eigenschaften könnten in der Zukunft verändert werden.

Übersicht

Die -webkit-mask-repeat Eigenschaft gibt an, ob und wie ein Maskenbild wiederholt (gekachelt) wird.

Initialwertrepeat
Anwendbar aufalle Elemente
VererbtNein
Medienvisuell
Berechneter Wertwie angegeben
AnimierbarNein
Kanonische ReihenfolgeReihenfolge des Auftretens in der formalen Grammatik der Werte

Syntax

/* 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;

Werte

repeat
Das Maskenbild wird horizontal und vertikal wiederholt.
repeat-x
Das Maskenbild wird nur horizontal wiederholt.
repeat-y
Das Maskenbild wird nur vertikal wiederholt.
no-repeat
Das Maskenbild wird nicht wiederholt; nur eine Kopie des Maskenbildes wird gezeichnet. Der Rest des Inhalts des maskierten Elements wird nicht dargestellt.

Formale Syntax

<repeat-style>[, <repeat-style>]*

wobei
<repeat-style> = repeat-x | repeat-y | [repeat | space | round | no-repeat]{1,2}

Beispiele

.exampleone {
  -webkit-mask-image: url('mask.png');
  -webkit-mask-repeat: repeat-x;
}

.exampletwo {
  -webkit-mask-image: url('mask.png');
  -webkit-mask-repeat: no-repeat;
}

Unterstützung mehrerer Maskenbilder

Für jedes Maskenbild kann ein unterschiedlicher <repeat-style> Wert angegeben werden, der durch Kommas getrennt wird:

.examplethree {
  -webkit-mask-image: url('mask1.png'), url('mask2.png');
  -webkit-mask-repeat: repeat-x, repeat-y;
} 

Jedes Bild wird dem zugehörigen Wiederholungsstil zugeordnet, vom zuerst bis zum zuletzt angegebenen.

Browser Kompatibilität

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Grundlegende Unterstützung 1.0 Nicht unterstützt Nicht unterstützt Nicht unterstützt 4.0
Merkmal Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Grundlegende Unterstützung 2.1 ? ? ? 3.2

Siehe auch

-webkit-mask, -webkit-mask-box-image, -webkit-mask-clip, -webkit-mask-origin, -webkit-mask-attachment, -webkit-mask-image, -webkit-mask-composite

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter: 
 Mitwirkende an dieser Seite: Sebastianz
 Zuletzt aktualisiert von: Sebastianz,