Der Hintergrund deines Dokumentes muss nicht weiß bleiben, oh Nein!
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
0 1 2 3 4 5 6 7 8 9 A B C D E F
Der Zahl 11 im Dezimalsystem entspricht also die Zahl B im Hexadezimalsystem, und der Zahl 16 im Dezimalsystem entspricht die Zahl 10 im Hexadezimalsystem. Für eine Farbe stehen zwei Hexadezimalziffern zur Verfügung, also 16*16=256 Farbabstufungen für jeweils Rot, Grün oder Blau, macht insgesamt 256*256*256 = 16777216 mögliche Farben. Jubel ist an dieser Stelle nicht angebracht, dein Computer kann mit den meisten Farbabstufungen nämlich gar nichts anfangen! Die Farbe wird also aus den Anteilen Rot, Grün und Blau zusammengemischt, hexadezimal versteht sich, und das ganze klingt nicht nur fürchterlich, es IST fürchterlich! In der Praxis -sprich in diesem Text- sieht das oben im <body>-Tag so aus:
<body bgcolor="#ffffe0">
dabei stehen die vier F's, das E und die 0 für einen Gelb-Ton, wie du unschwer der folgenden Übersicht entnimmst:
FF0000 : Rot |
FFFF80 : Gelb |
00FF00 : Grün |
0000FF : Blau |
808080 : Grau |
FFFFFF : Weiß |
000000 : Schwarz |
red, yellow, green, blue, gray, white oder black. |
<body bgcolor="yellow">aber der Farbton wäre vermutlich etwas anders, das meint zumindest mein Computer (bitte ausprobieren!).
<body background="texturec.jpg">
Wir können uns dieses Bild auch mal schnell anschauen, gibt aber nicht viel her (der schwarze Rand umrahmt nur das Bild). Mit dieser grauen Fliese wird der Browser-Hintergrund dann gekachelt! Was du jetzt noch brauchst, sind Bilder, einige findest auf CD-ROM, andere im Internet, kurz: hier ist der wahre Findergeist gefragt, du kannst dir dein Bild natürlich auch selbst gestalten, viel Spaß! |
Mit Bildern und Logos, Cliparts und animated Gifs fängt die wunderbare bunte Welt an, in der grundsätzlich nicht mehr gelesen wird (warum auch???). Wie also bindet man ein Bild ein? Ganz einfach, ein neues Tag muss her, das img-Tag, als Parameter wird über src (src=Source=Quelle) der Name des Bildes übergeben, im Beispiel wird die Datei "computer.gif" eingebunden:
<img src="computer.gif" align="Middle">
Der zweite Parameter, align bestimmt die Ausrichtung des Bildes, eine kleine Auswahl gefällig?
align="Top" | Ausrichtung des Bildes am Kopf der Zeile |
align="Middle" | Ausrichtung des Bildes in der Zeilen-Mitte des Absatzes |
align="Bottom" | Ausrichtung des Bildes am unteren Ende der Zeile |
align="Right" | Ausrichtung des Bildes rechtsbündig |
align="Left" | Ausrichtung des Bildes linksbündig |
Im Beispiel oben sorgt align dafür, dass das Bild möglichst in der Mitte der Zeilenhöhe gesetzt wird, mal sehen, ob der das kann?
Na toll, klappt doch prima! Animated Gifs sind übrigens kleine Animationen, gespeichert im GIF-Format, also nichts anderes als bewegte Bilder, Beispiel:
Das Ganze in HTML:<img src="hund.gif" height="35" width="220" align="bottom" alt="Pluto, Sitz!">Hinzugekommen ist die Angabe der Höhe (=height) und der Breite (=width) des Bildes. Diese Angaben entnimmt man beispielsweise einem Grafikprogramm. Damit kann man die Größe der Graphik verändern. Die alt-Angabe dient für Menschen, die auf Graphik verzichten wollen: Du kannst hier Informationen über die Grafik machen, die in einem kleinem Rahmen angezeigt werden, wenn man mit der Maus über die Grafik wandert. Damit der Hund in der Mitte läuft, muss das Bild zentriert werden, dafür benutzt du das <div>-Tag, aber bitte nicht das schließende div-Tag vergessen, sonst wird der ganze folgende Text zentriert formatiert! (Klar?) Bevor ichs vergesse: du übergibst dem div-Tag als Argument noch die Ausrichtung, also hier:
Und jetzt läuft unser Hund brav in der Mitte:
<font color="navy">
Vergisst du das schließende <font color="#ff11dd">FONT-Tag, dann wird der ganze Text bunt gesetzt, und zwar immer in der gleichen Farbe. <font color="#0000dd">Es sei denn, du änderst die Farbe.</font> Schluß jetzt!</font>