Übersicht
Die border-image-outset CSS Eigenschaft beschreibt, um welchem Wert der Randbildbereich über die Borderbox hinausragt.
| Initialwert | 0 |
|---|
| Anwendbar auf | Alle Elemente, außer interne Tabellenelemente, falls border-collapse collapse ist. Auch anwendbar auf ::first-letter. |
|---|
| Vererbt | Nein |
|---|
| Medien | visuell |
|---|
| Berechneter Wert | relativ zur gleichen Achse der Innenabstandsbox des Scrollcontainers |
|---|
| Animationstyp | by computed value type |
|---|
| Kanonische Reihenfolge | die eindeutige Reihenfolge definiert durch die formale Grammatik |
|---|
Syntax
[ <length> | <number> ]{1,4}
border-image-outset: Seiten /* Ein-Wert Syntax */ z. B. border-image-outset: 30%;
border-image-outset: vertikal horizontal /* Zwei-Werte Syntax */ z. B. border-image-outset: 10% 30%;
border-image-outset: oben horizontal unten /* Drei-Werte Syntax */ z. B. border-image-outset: 30px 30% 45px;
border-image-outset: oben rechts unten links /* Vier-Werte syntax */ z. B. border-image-outset: 7px 12px 14px 5px;
border-image-repeat: inherit
Werte
- Seiten
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich die Borderbox in allen vier Richtungen überragt.
- horizontal
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich die Borderbox in beiden horizontalen Richtungen überragt.
- vertikal
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich die Borderbox in beiden vertikalen Richtungen überragt.
- oben
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich über den oberen Rand der Borderbox hinausragt.
- unten
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich über den unteren Rand der Borderbox hinausragt.
- rechts
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich über den rechten Rand der Borderbox hinausragt.
- links
- Ist ein
<length> oder ein <percentage> Wert, der den Betrag angibt, um welchen der Randbildbereich über den linken Rand der Borderbox hinausragt.
inherit- Ist ein Schlüsselwort, das angibt, dass alle vier Werte vom berechneten Wert des Elternelements geerbt werden.
Spezifikation
Browser Kompatibilität
Update compatibility data on GitHub | Desktop | Mobile |
|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | Android Webview | Chrome für Android | Firefox für Android | Opera für Android | Safari auf iOS | Samsung Internet |
|---|
border-image-outset | 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
6 | Samsung Internet Android
?
|
|---|
Legende
-
Vollständige Unterstützung
- Vollständige Unterstützung
-
Kompatibilität unbekannt
- Kompatibilität unbekannt