Heim >Web-Frontend >HTML-Tutorial >Kann ich mehrere Hintergrundbilder zu HTML hinzufügen?

Kann ich mehrere Hintergrundbilder zu HTML hinzufügen?

青灯夜游
青灯夜游Original
2021-12-14 12:56:329145Durchsuche

html kann mehrere Hintergrundbilder hinzufügen. In HTML können Sie über „Hintergrundbild“ oder „Hintergrund“ mehrere Hintergrundbilder für einen Container festlegen, d. h. unterschiedliche Hintergrundbilder in nur ein Blockelement einfügen. Die Syntax lautet „Hintergrund: URL (Bildadresse), URL (Adresse).“ .; ".

Kann ich mehrere Hintergrundbilder zu HTML hinzufügen?

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

In HTML können Sie über „Hintergrundbild“ oder „Hintergrund“ mehrere Hintergrundbilder für einen Container festlegen, was bedeutet, dass Sie unterschiedliche Hintergrundbilder in nur ein Blockelement einfügen können.

Schauen wir uns zunächst die Syntax an:

background : [background-image] | [background-origin] | [background-clip] | [background-repeat] | [background-size] | [background-attachment] | [background-position]

Verwenden Sie Kommas, um die URLs mehrerer Hintergrundbilder und nur ein anderes Attribut zu trennen (z. B. gibt es nur eine Hintergrundwiederholung). Auf alle Hintergrundbilder wird dieser Eigenschaftswert angewendet.

Schauen wir uns ein Beispiel an:

body {
  background-image: url(https://image.flaticon.com/icons/svg/748/748122.svg), url(https://images.unsplash.com/photo-1478719059408-592965723cbc?ixlib=rb-1.2.1&auto=format&fit=crop&w=2212&q=80);
  background-position: center, top;
  background-repeat: repeat, no-repeat;
  background-size: contain, cover;
}

Kann ich mehrere Hintergrundbilder zu HTML hinzufügen?

Empfohlenes Tutorial: „HTML-Video-Tutorial

Das obige ist der detaillierte Inhalt vonKann ich mehrere Hintergrundbilder zu HTML hinzufügen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn