Um ein Bild hinter dem Element festzulegen, das “HintergrundbildEigentum von CSS kommt ins Spiel. Standardmäßig wird es in der oberen linken Ecke des Bildschirms angezeigt und wird horizontal und vertikal wiederholt. Sie können auch mehr als ein Bild im Hintergrund des HTML -Elements hinzufügen. Stellen Sie außerdem die Breite und Höhe des Bildes gemäß Ihren Vorlieben ein. Sie können jedoch auch die Wiederholung des Bildes stoppen.

Diese Beschreibung liefert die folgenden Lernergebnisse:

• • Hintergrund-Image-Eigenschaft
  • So setzen Sie ein Hintergrundbild

"Hintergrundbild" CSS-Eigenschaft

Der "HintergrundbildDie Eigenschaft wird verwendet, um ein Bild im Hintergrund eines angegebenen Tags anzuwenden.

Syntax

Hier ist die Syntax, um ein Hintergrundbild auf ein HTML -Element festzulegen:

Hintergrundbild: Bild-URL ();

Hier hat Bild url () den Bildnamen oder den Bildordnerpfad, in dem er existiert.

Versuchen wir ein Beispiel, um ein besseres Verständnis zu haben.

Beispiel: So setzen Sie ein Hintergrundbild mit CSS?

In diesem Beispiel werden wir zunächst zwei weitere Elemente erstellen (

Und

Tags), hinter dem das Hintergrundbild hinzugefügt wird. Sie können Elemente entsprechend Ihrer Wahl hinzufügen und eine Hintergrundbild-Eigenschaft anwenden:

Hintergrundbild setzen

Um das Hintergrundbild zu setzen, verwenden Sie CSS -Hintergrundbildeigenschaft

Sie können Elemente entsprechend Ihrer Auswahl hinzufügen und eine Hintergrundbild-Eigenschaft anwenden.

Gehen Sie zum CSS und weisen Sie den Namen des Bildes in “zu“ zu “HintergrundbildURL:

Körper
Hintergrundbild: URL ("IMG.JPG ");

Sobald Sie alle Schritte ausgeführt haben, führen Sie die HTML -Datei aus, Sie erhalten das folgende Ergebnis:

Hier können Sie sehen, dass das Hintergrundbild wiederholt wird. Um dies zu vermeiden, verwenden Sie die “Hintergrund Wiederholung"Eigenschaft und setzen Sie ihren Wert auf"No-Repeat”:

Körper
Hintergrundbild: URL ("IMG.JPG ");
Hintergrundrepeat: No-Repeat;

Sobald alles fertig ist, führen Sie den Code aus und lesen Sie Ihre Webseite:

Jetzt haben Sie ein sauberes und elegantes Aussehen des Hintergrundbilds auf dem Tag.

Gute Praktiken zum Festlegen von Hintergrundbildern

• • Wählen Sie ein Bild aus, das Ihrer Textfarbe entspricht.
  • Verwenden Sie attraktive Farbkombinationen.
  • Wenn Ihr Hintergrundbild und Ihre Textfarbe nicht miteinander übereinstimmen, ist Ihre Webseite schlecht gestaltet.

Abschluss

Verwenden Sie das “, um ein Hintergrundbild in CSS hinzuzufügenHintergrundbildEigenschaft und geben Sie die URL des Bildes in der URL () -Funktion von CSS an. Sie können auch verhindern, dass Ihr Bild durch die „Verwendung der“ wiederholt wirdHintergrund Wiederholung"Eigenschaft und festlegen ihren Wert auf"keiner”. In diesem Artikel wurde das Verfahren erläutert, um dem Hintergrund ein Bild mit der “hinzuzufügenHintergrundbild" Und "Hintergrund Wiederholung" Eigenschaften.