CSS Referenzhandbuch

CSS @Regeln (RULES)

Vollständiges Verzeichnis der CSS-Attribute

CSS3 border-image-width Eigenschaft CSS3 border-image-slice Eigenschaft

CSS3 border-image-Verwendung und Beispiel der 'source'-Eigenschaft

border-image-Die source CSS Eigenschaft bestimmt den Ort des Bildes, das für die Kante verwendet werden soll, anstattborder-styleDurch diese Eigenschaft bestimmte Kantenstil.

Die folgende Tabelle enthält die Beschreibung der Verwendung und die Versionshistorie dieser Eigenschaft sowie die Verwendungssyntax in JavaScript-Skripten.

Standardwert:	none
Anwendbar auf:	Diese Eigenschaft kann auf alle Elemente angewendet werden, aber wenn die Tabellenelemente (wie tr,th,td) der border-Wenn der Wert der collapse Eigenschaft collapse ist, border-image-source Eigenschaft ist ungültig. Es gilt auch für::first-letter。
Vererbung:	Keine
Animierbar:	Nein.Bitte参见 Animationseigenschaften。
Version:	CSS3neue Funktion
JavaScript-Syntax:	object.style.borderImageSource="url(border.png)"

border-image-Syntax der Verwendung von source

Die Syntax dieses Wertes ist wie folgt:

border-image-source: none | image | initial | inherit

Die folgenden Beispiele zeigen, wie man border-image-source Eigenschaft.

Beispiel

.box　{
　　　　width:　300px;
　　　　height:　150px;
　　　　border-image-source: url("border.png");
　　　　border-image-slice:　30;
　　　　border-image-repeat: round;
}

Testen Sie es heraus‹/›

Eigenschaftswert

Die folgende Tabelle beschreibt die Werte dieser Eigenschaft.

Wert	Beschreibung
none	Es gibt kein Bild der Kante, es wird der Kantenstil verwendet. Dies ist der Standardwert.
image	Bestimmen Sie den Ort der Bildposition der Kante.
initial	Setzen Sie diesen Wert auf seinen Standardwert.
inherit	Wenn angegeben, wird der border des übergeordneten Elements verwendet.-image-berechneter Wert des source-Eigenschafts.

Browserkompatibilität

border-image-Kompatibilität des source-Eigenschafts der Browser, die in der folgenden Tabelle angegebenen Zahlen stellen die niedrigste Versionsnummer der Browser dar, die diese Eigenschaft unterstützen; alle gängigen Browser unterstützen diese Eigenschaft.

	Firefox 15+ Google Chrome15+ Internet Explorer 11+ Apple Safari 6+ Opera 15+

Weiterlesen

Bitte lesen Sie die folgenden Tutorials:CSS3 BorderundCSS Border。

zusammenhängende Eigenschaften:border-image，border-image-width，border-image-repeat，border-image-slice，border-image-outset，border。

CSS3 border-image-width Eigenschaft CSS3 border-image-slice Eigenschaft