Wie man mit CSS dafür sorgt, dass sich Hintergrundbilder nicht wiederholen

-Tag ein, um diesem Tag eine Klasse hinzuzufügen und den Stil des Hintergrunds festzulegen Bild. Wie im Bild gezeigt:

css legt den Hintergrund so fest, dass er sich nicht wiederholt.

legt den Hintergrundbildstil fest. Erstellen Sie ein

1. Fügen Sie ein Hintergrundbild ein.

2. Stellen Sie die Breite und Höhe des Hintergrundbilds ein (Hinweis: Der Effekt ist nicht sichtbar, ohne die Breite und Höhe festzulegen).

Sehen Sie sich den Seiteneffekt an. Speichern Sie die HTML-Seite, öffnen Sie sie mit einem Browser und stellen Sie fest, dass das Hintergrundbild wiederholt wird. Wie im Bild gezeigt:

Stellen Sie das Hintergrundbild so ein, dass es sich nicht wiederholt. Kehren Sie zur HTML-Codeseite zurück und fügen Sie „background-repeat: no-repeat;“ zum Klassenstil hinzu:

, um den Seiteneffekt anzuzeigen. Speichern Sie die HTML-Seite und öffnen Sie sie mit einem Browser. Sie werden feststellen, dass das Hintergrundbild nicht mehr wiederholt wird. Wie im Bild gezeigt:

Alle Codes auf der Seite. Sie können den gesamten Code direkt kopieren und in die neue HTML-Seite einfügen. Nach dem Speichern können Sie den Seiteneffekt sehen. (Hinweis: Das Hintergrundbild in diesem Fall ist ein lokaler Pfad. Sie müssen den Hintergrundbildpfad nach dem Einfügen des Codes ändern.)

Alle Codes:

<style type="text/css">
.bg-repeat{
background-image: url(img/ye.png);
width: 500px;
height: 380px;
}
</style>