Heim > Artikel > Web-Frontend > So verkleinern Sie das Hintergrundbild in CSS
In CSS können Sie das Attribut „Hintergrundgröße“ verwenden, um die Größe des Hintergrundbilds zu steuern. Sie müssen nur den Stil „Hintergrundgröße: Breitenwert“ hinzufügen das Hintergrundelement.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
In CSS können Sie das Attribut „background-size“ verwenden, um das Hintergrundbild zu verkleinern.
Das Attribut „Hintergrundgröße“ wird verwendet, um die Größe des Hintergrundbilds anzugeben. Das Syntaxformat ist wie folgt:
background-size: length|percentage|cover|contain;
Wert | Beschreibung |
---|---|
Länge | Legen Sie die Höhe und Breite des Hintergrundbilds fest. Der erste Wert legt die Breite fest und der zweite Wert legt die Höhe fest. Wenn nur ein Wert angegeben wird und der zweite auf auto(automatisch) eingestellt ist, berechnet |
percentage | den Prozentsatz des Positionierungsbereichs relativ zum Hintergrund. Der erste Wert legt die Breite fest und der zweite Wert legt die Höhe fest. Wenn nur ein Wert angegeben wird, wird der zweite Wert auf „Auto“ |
cover | gesetzt, wodurch das Seitenverhältnis des Bildes beibehalten und das Bild auf die Mindestgröße skaliert wird, die den Hintergrundpositionierungsbereich vollständig abdeckt. |
enthalten | Dadurch wird das Seitenverhältnis des Bildes beibehalten und das Bild auf die maximale Größe skaliert, die in den Hintergrundpositionierungsbereich passt. 🔜 |
Empfohlenes Tutorial: „
CSS-Video-Tutorial“
Das obige ist der detaillierte Inhalt vonSo verkleinern Sie das Hintergrundbild in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!