Übersicht
Die border-image-repeat
CSS Eigenschaft definiert, wie der mittlere Teil eines Randbildes gehandhabt wird, sodass es in die Ausmaße des Randes passt. Sie hat eine Einwert-Syntax, welche das Verhalten aller Seiten beschreibt, und eine Zweiwert-Syntax, welche unterschiedliche Werte für das horizontale und vertikale Verhalten setzt.
Initialwert | stretch |
---|---|
Anwendbar auf | Alle Elemente, außer interne Tabellenelemente, falls border-collapse collapse ist. Auch anwendbar auf ::first-letter . |
Vererbt | Nein |
Medien | visuell |
Berechneter Wert | wie angegeben |
Animationstyp | diskret |
Kanonische Reihenfolge | die eindeutige Reihenfolge definiert durch die formale Grammatik |
Syntax
/* border-image-repeat: Typ */ border-image-repeat: stretch; /* border-image-repeat: horizontal vertikal */ border-image-repeat: round stretch; /* Globale Werte */ border-image-repeat: inherit; border-image-repeat: initial; border-image-repeat: unset;
Werte
- type
- Eins der Schlüsselwörter
stretch
,repeat
,round
oderspace
, die angeben, wie das Bild wiederholt wird. Dies wird nur in der Einwert-Syntax verwendet. - horizontal
- Eins der Schlüsselwörter
stretch
,repeat
,round
oderspace
, die angeben, wie das Bild horizontal wiederholt wird. Dies wird nur in der Zweiwert-Syntax verwendet. - vertical
- Eins der Schlüsselwörter
stretch
,repeat
,round
oderspace
, die angeben, wie das Bild vertikal wiederholt wird. Dies wird nur in der Zweiwert-Syntax verwendet. stretch
- Schlüsselwort, das angibt, dass das Bild gedehnt werden soll, um den Leerraum zwischen beiden Rändern zu füllen.
repeat
- Schlüsselwort, das angibt, dass das Bild wiederholt werden soll, um den Leerraum zwischen beiden Rändern zu füllen.
round
- Schlüsselwort, das angibt, dass das Bild wiederholt werden soll bis es den Leerraum zwischen beiden Rändern füllt. Falls das Bild nach einer ganzzahligen Wiederholung nicht den gesamten Leerraum ausfüllt, wird es skaliert, damit es passt.
inherit
- Schlüsselwort, das angibt, dass die Werte vom berechneten Wert des Elternelements geerbt werden sollen.
Formale Syntax
[ stretch | repeat | round | space ]{1,2}
Beispiele
Siehe border-image
für Beispiele, welche Auswirkungen Wiederholungswerte haben.
Spezifikationen
Spezifikation | Status | Anmerkung |
---|---|---|
CSS Backgrounds and Borders Module Level 3 Die Definition von 'border-image-repeat' in dieser Spezifikation. |
Anwärter Empfehlung | Ursprüngliche Definition |
Browser Kompatibilität
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
border-image-repeat | Chrome Vollständige Unterstützung 15 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 15 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 15 | Safari Vollständige Unterstützung 6 | WebView Android Vollständige Unterstützung ≤37 | Chrome Android Vollständige Unterstützung 18 | Firefox Android Vollständige Unterstützung 15 | Opera Android ? | Safari iOS Vollständige Unterstützung 9.3 | Samsung Internet Android ? |
round | Chrome Vollständige Unterstützung 30 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 15 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 17 | Safari Vollständige Unterstützung 9.1 | WebView Android Vollständige Unterstützung ≤37 | Chrome Android Vollständige Unterstützung 30 | Firefox Android Vollständige Unterstützung 15 | Opera Android ? | Safari iOS Vollständige Unterstützung 9.3 | Samsung Internet Android ? |
space | Chrome Vollständige Unterstützung 56 | Edge Vollständige Unterstützung 12 | Firefox Vollständige Unterstützung 50 | IE Vollständige Unterstützung 11 | Opera Vollständige Unterstützung 43 | Safari Vollständige Unterstützung 9.1 | WebView Android Vollständige Unterstützung 56 | Chrome Android Vollständige Unterstützung 56 | Firefox Android Vollständige Unterstützung 50 | Opera Android ? | Safari iOS Vollständige Unterstützung 9.3 | Samsung Internet Android ? |
Legende
- Vollständige Unterstützung
- Vollständige Unterstützung
- Kompatibilität unbekannt
- Kompatibilität unbekannt