Hintergrundbilder (Wallpapers) |
|
Hintergrundbild einbinden |
|
Anzeigebeispiel: So sieht's aus
Sie können für die Anzeige einer HTML-Datei ein Hintergrundbild bestimmen. Dabei wird das Bild über das ganze Anzeigefenster hinweg immer wiederholt, so daß ein Tapeteneffekt (Wallpaper) entsteht. Viele Windows-Anwender kennen diesen Effekt, da in Windows die Möglichkeit besteht, den Desktop mit einem solchen Wallpaper auszustatten. Besonders geeignet für Wallpaper-Effekte sind relativ kleine Grafiken (nicht viel größer als Icon-Größe), die irgendein abstraktes Muster darstellen.
Die Hintergrundgrafik muß als Grafikdatei im GIF- oder JPEG-Format vorliegen.
<body background="kacheln.gif"> |
Die Angabe zum Einbinden eines Hintergrundbildes erfolgt im einleitenden <body>-Tag der HTML-Datei (siehe hierzu Grundgerüst einer HTML-Datei. Mit der Zusatzangabe background= bestimmen Sie eine Grafikdatei als Hintergrundbild (background = Hintergrund). Die gesamte HTML-Datei wird auf dem hier definierten Hintergrundbild angezeigt.
Im Beispiel wird vorausgesetzt, daß sich die Grafikdatei im gleichen Verzeichnis befindet wie die HTML-Datei. Wenn die Grafik in einem anderen Verzeichnis steht, müssen Sie den relativen oder absoluten Pfadnamen angeben. Das funktioniert genau so wie beim Einbinden von Grafiken.
Das Hintergrundbild gilt jeweils für die HTML-Datei, in der es definiert wird. Wenn Sie ein Dokument aus mehreren HTML-Dateien erstellen, das einen einheitlichen Hintergrund haben soll, müssen Sie die Angabe in jeder HTML-Datei wiederholen.
Wenn Sie ein Hintergrundbild definieren, sollten Sie auch passende Textvordergrundfarben definieren.
Verwenden Sie bei textorientierten WWW-Seiten unauffällige Hintergrundbilder, bei denen die Lesbarkeit des Textes nicht leidet. Auffällige Hintergrundfarben sollten Sie nur verwenden, wenn die gesamte WWW-Seite grafisch aufgebaut ist und wenn die Grafiken im Vordergrund zu dem auffälligen Hintergrund passen.
Innerhalb dieses Dokuments finden Sie im Abschnitt über typische Grafiksorten für WWW-Seiten ein paar typische Hintergrundbilder.
Netscape 4.x und MS Internet Explorer 4.x interpretieren auch animierte GIF-Grafiken als Hintergrundbilder.
Anzeigebeispiel: So sieht's aus
Der MS Internet Explorer erlaubt bei Hintergrundbildern eine Zusatzangabe, mit deren Hilfe Sie erreichen, daß sich das Hintergrundbild beim Scrollen nicht bewegt. Der Hintergrund wirkt dadurch wie abgelöst vom Vordergrund (Wasserzeichen-Effekt).
<body background="kacheln.gif" bgproperties=fixed> |
Durch die Zusatzangabe bgproperties=fixed im Zusammenhang mit der Zusatzangabe background= erzwingen Sie den Wasserzeichen-Effekt.
Wenn Sie HTML bereits etwas besser kennen, probieren Sie auch mal die Möglichkeiten aus, die Ihnen CSS Style-Sheets bieten. Denn auch damit können Sie Hintergrundbilder. Dazu müssen Sie zunächst wissen, wie man Style-Sheets definieren kann. Anschließend sind Sie in der Lage, Style-Sheet-Angaben anzuwenden. Indem Sie Style-Sheet-Angaben auf das <body>-Tag anwenden, stehen Ihnen wesentlich mehr Möglichkeiten zur Verfügung als bei den hier beschriebenen Attributen. Sie können auch Style-Sheets in einer separaten Datei definieren und diese Datei dann in beliebig viele HTML-Dateien Ihres Projekts einbinden. So ist es leichter, mit einem dateiübergreifenden Layout zu arbeiten. Interessant sind im hier beschriebenen Zusammenhang die folgenden Style-Sheet-Angaben:
Hintergrundfarben und -bilder
Das <body>-Tag kann Universalattribute enthalten.
weiter: | Seitenränder |
zurück: | Farbe für Hintergrund, Text und Verweise |