Unterstützt CSS3 das Hinzufügen mehrerer Hintergrundbilder zu Webseiten?

css3 unterstützt das Hinzufügen mehrerer Hintergrundbilder zu Webseiten. In CSS können Sie mehrere Hintergrundbilder zu einer Webseite hinzufügen, indem Sie direkt mehrere Hintergrundpfade im Attribut „Hintergrundbild“ angeben. Das Syntaxformat lautet „Hintergrundbild: URL (Bildadresse), URL (Bildadresse) …“ " .

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

Mehrere Hintergrundbilder in CSS verwenden

Was ist, wenn Sie mehr als ein Bild zum Hintergrund hinzufügen möchten? Mehrere Hintergrundpfade können direkt in CSS3 angegeben werden, wie unten gezeigt:

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;
}

Rendering:

Vollständige Beispieladresse: https://codepen.io/duomly/pen/eYpVoJR

(Lernvideo Teilen : CSS-Video-Tutorial)

Das obige ist der detaillierte Inhalt vonUnterstützt CSS3 das Hinzufügen mehrerer Hintergrundbilder zu Webseiten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!