Beispiel
Setzen Sie den Rahmen Bild 10 Pixel außerhalb der Randkanten eines Elements:
#borderimg
{
border-image-source: url(border.png);
border-image-outset: 10px;
}
Definition und Verwendung
Die border-image-Anfang-Eigenschaft gibt den Betrag, um den die Grenze Bildbereich jenseits der Grenze Feld erstreckt.
Tipp: Schauen Sie auch an der Grenzbildeigenschaft (a shorthand property for setting all the border-image-* properties) von (a shorthand property for setting all the border-image-* properties) .
| Standardwert: | 0 |
|---|---|
| Vererbt: | no |
| Anima: | no. Read about animatable |
| Version: | CSS3 |
| JavaScript-Syntax: | object .style.borderImageOutset="10px" Try it |
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die die Eigenschaft vollständig unterstützt.
| Eigentum | |||||
|---|---|---|---|---|---|
| border-image-outset | 15,0 | 11.0 | 15,0 | 6.0 | 15,0 |
CSS-Syntax
border-image-outset:length|number|initial|inherit;Note: Die border-image-Anfang Eigenschaft von einem bis vier Werte annehmen kann (top, right, bottom, and left sides) . Wenn der vierte Wert weggelassen wird, ist es dasselbe wie das zweite. Wenn der dritte ebenfalls weggelassen wird, ist es dasselbe wie das erste. Wenn der zweite ebenfalls weggelassen wird, ist es dasselbe wie das erste.
Eigenschaftswerte
| Wert | Beschreibung | Spiel es |
|---|---|---|
| length | Eine Längeneinheit angibt, wie weit von den Rändern der Grenz Bild angezeigt wird. Der Standardwert ist 0 | Spiel es " |
| number | Sie sind Vielfache der entsprechenden border-width | Spiel es " |
| initial | Setzt diese Eigenschaft auf den Standardwert. Lesen Sie mehr über Anfangs | Spiel es " |
| inherit | Erbt diese Eigenschaft von seinem übergeordneten Element. Lesen Sie mehr über erben |
Verwandte Seiten
CSS3 Tutorial: CSS3 Border Images
CSS Referenz: border-image property - border-image property
CSS Referenz: border-image-repeat property
CSS Referenz: border-image-slice property - border-image-slice property
CSS Referenz: border-image-source property - border-image-source property
CSS Referenz: border-image-width property
HTML - DOM - Referenz: borderImageOutset property