Heim > Web-Frontend > Front-End-Fragen und Antworten > So legen Sie den Hintergrund von HTML fest

So legen Sie den Hintergrund von HTML fest

王林
Freigeben: 2023-05-15 15:50:07
Original
13082 Leute haben es durchsucht

Mit der rasanten Entwicklung des Internets legt das Webdesign immer mehr Wert auf Benutzererfahrung und visuelle Effekte. Der Hintergrund einer Webseite ist ein wichtiger Teil des Webdesigns. Ein guter Hintergrund kann einer Webseite Leben einhauchen und das Benutzererlebnis verbessern. Als Nächstes wird in diesem Artikel ausführlich beschrieben, wie der Hintergrund von HTML festgelegt wird.

1. Grundkenntnisse des HTML-Hintergrunds

1.1 Hintergrundfarbe

Das Festlegen der HTML-Hintergrundfarbe kann mithilfe von CSS (Stylesheet) oder direkt im HTML-Tag erfolgen. In CSS können Sie den Eigenschaftswert „background-color“ verwenden, um die Farbe für den Hintergrund festzulegen. Um beispielsweise die Hintergrundfarbe auf Blau festzulegen, können Sie den folgenden Code zu CSS hinzufügen:

body {
background-color: blue;
}

Um die Hintergrundfarbe im HTML-Tag festzulegen, können Sie das Attribut verwenden Wert von „bgcolor“ als Hintergrundfarbe festlegen. Zum Beispiel:

1.2 Hintergrundbild

Um das HTML-Hintergrundbild festzulegen, können Sie den Attributwert „background-image“ in CSS verwenden. Um beispielsweise das Hintergrundbild auf „bg.png“ festzulegen, können Sie den folgenden Code in CSS hinzufügen:

body {
background-image: url(bg.png);
}

Darüber hinaus können Sie auch Verwenden Sie andere Attributwerte. Passen Sie die Position und Wiederholung des Hintergrundbilds an (z. B. „Hintergrundposition“ und „Hintergrundwiederholung“ usw.).

2. Praktische Vorgehensweise beim Festlegen eines HTML-Hintergrunds

2.1 Festlegen eines einfarbigen Hintergrunds

Im eigentlichen Entwicklungsprozess entscheiden wir uns normalerweise dafür, einen oder mehrere einfarbige Hintergründe festzulegen, um visuelle Effekte zu erzielen. Das Folgende ist ein praktischer Vorgang zum Erstellen eines einfarbigen Hintergrunds:

① Ändern Sie die CSS-Datei

Fügen Sie den folgenden Code in die CSS-Datei ein:

body {
background-color: #ffcc00;
}

kann festlegen Hintergrundfarbe zu Dunkelgelb ( #ffcc00).

② Legen Sie die Hintergrundfarbe direkt im HTML-Tag fest.

Fügen Sie den folgenden Code zum HTML-Tag hinzu:

Die Hintergrundfarbe kann auf Dunkelgelb (#ffcc00) eingestellt werden ).

2.2 Hintergrundbild festlegen

Im Webdesign fügen wir Hintergrundbilder hinzu, um einen lebendigeren und schöneren Effekt zu erzielen. Das Folgende ist die praktische Vorgehensweise zum Festlegen des Hintergrundbilds einer Webseite:

① Ändern Sie die CSS-Datei

Fügen Sie den folgenden Code in die CSS-Datei ein:

body {
background-image: url(bg.png );
background-repeat: repeat- x;
}

Sie können „bg.png“ als Hintergrundbild der Webseite verwenden und es auf horizontale Kacheln einstellen.

② Fügen Sie das Hintergrundbild direkt zum HTML-Tag hinzu.

Fügen Sie den folgenden Code zum HTML-Tag hinzu:

Sie können „bg.png“ als Hintergrund verwenden Bild der Webseite.

2.3 Stellen Sie die Kombination aus Hintergrundbild und Hintergrundfarbe ein

Im eigentlichen Webdesign-Prozess können wir auch durch die Kombination von Hintergrundbildern und Hintergrundfarben bessere Ergebnisse erzielen. Im Folgenden finden Sie eine praktische Vorgehensweise zum Kombinieren von Hintergrundbildern und Hintergrundfarben:

① Ändern Sie die CSS-Datei.

Fügen Sie den folgenden Code in die CSS-Datei ein:

body {
background-color: #ffcc00;
background-image : url(bg .png);
background-repeat: no-repeat;
background-position: center centre;
}

Sie können die Hintergrundfarbe auf Dunkelgelb (#ffcc00) einstellen und „bg.png“ als verwenden das Hintergrundbild der Webseite und stellen Sie es auf eine sich nicht wiederholende und zentrierte Anzeige ein.

② Legen Sie die Hintergrundfarbe und das Hintergrundbild direkt im HTML-Tag fest.

Fügen Sie den folgenden Code zum HTML-Tag hinzu:

Ähnlich, Sie können den Hintergrund hinzufügen. Stellen Sie die Farbe auf Dunkelgelb (#ffcc00) und verwenden Sie „bg.png“ als Hintergrundbild der Webseite.

3. Zusammenfassung

Das Festlegen eines HTML-Hintergrunds ist eine Fähigkeit, die wir im Webdesign beherrschen müssen. Durch die Einleitung dieses Artikels verfügen wir über ein tiefgreifendes Verständnis der Grundkenntnisse und praktischen Vorgänge des HTML-Hintergrunds. Ich hoffe, dieser Artikel wird den Lesern helfen. Lassen Sie uns zusammenarbeiten, um ein lebendigeres, schöneres und benutzerfreundlicheres Webdesign zu erstellen!

Das obige ist der detaillierte Inhalt vonSo legen Sie den Hintergrund von HTML fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage