Style backgroundSize-Eigenschaft
- Vorherige Seite backgroundOrigin
- Nächste Seite backfaceVisibility
- Zurück zur vorherigen Ebene HTML DOM Style-Objekt
Definition und Verwendung
backgroundSize
Eigenschaftseinstellungen oder Rückgabe der Größe des Hintergrundbildes.
Weitere Informationen:
HTML-Stil:background-Eigenschaft
CSS-Tutorial:CSS-Hintergrund
CSS3-Tutorial:CSS3-Hintergrund
CSS-Referenzhandbuch:background-size-Eigenschaft
Beispiel
Definieren Sie die Größe des Hintergrundbildes:
document.getElementById("myDIV").style.backgroundSize = "60px 120px";
Syntax
Rückgabe der backgroundSize-Eigenschaft:
object.style.backgroundSize
Setzen Sie die backgroundSize-Eigenschaft:
object.style.backgroundSize = "auto|length|cover|contain|initial|inherit"
Eigenschaftswert
Wert | Beschreibung |
---|---|
auto | Standardwert. Das Hintergrundbild enthält seine Breite und Höhe. |
length |
Setzen Sie die Breite und Höhe des Hintergrundbildes. Der erste Wert setzt die Breite fest, der zweite Wert die Höhe. Wenn nur ein Wert angegeben wird, wird der zweite auf "auto" gesetzt. |
percentage |
Setzen Sie die Breite und Höhe des Hintergrundbildes in Prozent der Höhe des Elternelements. Der erste Wert setzt die Breite fest, der zweite Wert die Höhe. Wenn nur ein Wert angegeben wird, wird der zweite auf "auto" gesetzt. |
cover |
Vergrößern Sie das Hintergrundbild so weit wie möglich, um den Hintergrundbereich vollständig durch das Hintergrundbild zu überdecken. Einige Teile des Hintergrundbildes könnten nicht im Hintergrundpositionierungsbereich sein. |
contain | Vergrößern Sie das Bild so weit, dass seine Breite und Höhe dem Inhaltsbereich entsprechen. |
initial | Setzen Sie diesen Wert auf seinen Standardwert. Siehe initial. |
inherit | Erben Sie diese Eigenschaft von ihrem Elternelement. Siehe inherit. |
Technische Details
Standardwert: | auto |
---|---|
Rückgabewert: | Zeichenkette, die den background-size-Eigenschaft. |
CSS-Version: | CSS3 |
Browser-Unterstützung
backgroundSize
ist eine CSS3 (1999) Eigenschaft.
Betreuen alle Browser es vollständig:
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
Unterstützt | Unterstützt | Unterstützt | Unterstützt | Unterstützt | 11 |
- Vorherige Seite backgroundOrigin
- Nächste Seite backfaceVisibility
- Zurück zur vorherigen Ebene HTML DOM Style-Objekt