CSS/Eigenschaften/background-size
Aus SELFHTML-Wiki
< CSS | Eigenschaften
- Erlaubte Werte
- eine oder zwei Längenangaben: legen die Abmessungen fest, mit denen die Grafik dargestellt wird. Der erste Wert ist die gewünschte Breite, der zweite Wert die gewünschte Höhe - fehlt der zweite Wert, wird
auto
angenommen. Wird für einen der beiden Werteauto
verwendet, wird dieser Wert an Hand des natürlichen Seitenverhältnisses der Grafik aus dem anderen Wert berechnet. Schreibt man nurauto
, verwendet der Browser auch die natürliche Größe der Grafik. -
contain
: passt unter Beibehaltung des Seitenverhältnisses die größere Seite der Grafik in den Anzeigebereich ein, ergibt eine vollständige Füllung des Anzeigebereiches -
cover
: passt unter Beibehaltung des Seitenverhältnisses die kleinere Seite der Grafik in den Anzeigebereich ein
- eine oder zwei Längenangaben: legen die Abmessungen fest, mit denen die Grafik dargestellt wird. Der erste Wert ist die gewünschte Breite, der zweite Wert die gewünschte Höhe - fehlt der zweite Wert, wird
- Vererbung steuernde Werte
inherit
,initial
,unset
undrevert
- Standardwert
auto
- anwendbar auf
alle Elemente
- Vererbung
nein
- animierbar
ja (Zahlenwerte, aber keine Schlüsselwörter)
Beispiel
body {
background-image: url(…);
background-size: 50% 100%;
}
Beachten Sie:
Soll nur die Höhe festgelegt werden, so kann dies mit background-size: auto 100px;
geschehen. Prozentangaben sind im Gegensatz zu negativen Werten ebenfalls erlaubt. Sie beziehen sich auf die entsprechenden Angaben des Anzeigebereichs.
contain
als size-Angabe angenommen.Siehe auch
Weblinks
- Spezifikation (W3C): background-size