Beispiel
Gibt an, wie das Randbild zu wiederholen:
#borderimg
{
border-image-source: url(border.png);
border-image-repeat: repeat;
}
Versuch es selber " Definition und Verwendung
Die border-image-repeat Eigenschaft gibt an, ob das Randbild sollte wiederholt, gerundet oder gestreckt werden.
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: | stretch |
|---|---|
| Vererbt: | no |
| Anima: | no. Read about animatable |
| Version: | CSS3 |
| JavaScript-Syntax: | object .style.borderImageRepeat="round" 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-repeat | 15,0 | 11.0 | 15,0 | 6.0 | 15,0 |
CSS-Syntax
border-image-repeat: stretch|repeat|round|initial|inherit;Note: Diese Eigenschaft gibt an, wie die Bilder für die Seiten und den mittleren Teil des Rahmenbildes skaliert und mit Ziegeln gedeckt. So können Sie zwei Werte, die hier angegeben werden. Wenn der zweite Wert angegeben wird, wird angenommen, das gleiche wie das erste sein.
Eigenschaftswerte
| Wert | Beschreibung | Spiel es |
|---|---|---|
| stretch | Standardwert. Das Bild wird gestreckt, um den Bereich zu füllen | Spiel es " |
| repeat | Das Bild wird mit Ziegeln gedeckt (repeated) den Bereich zu füllen | Spiel es " |
| round | Das Bild wird mit Ziegeln gedeckt (repeated) den Bereich zu füllen. Wenn es nicht den Bereich mit einer ganzen Anzahl von Fliesen füllt, wird das Bild neu skaliert, so dass es passt | Spiel es " |
| space | Das Bild wird mit Ziegeln gedeckt (repeated) den Bereich zu füllen. Wenn es nicht den Bereich mit einer ganzen Anzahl von Fliesen füllt, wird der zusätzliche Platz um die Fliesen herum verteilt | |
| 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-outset 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: borderImageRepeat property