Informatik :: HTML :: Bilder
Es wurde von CompuServe speziell für den Online-Einsatz entwickelt.
Vorteile:
Nachteil: maximal 256 Farben pro Datei speicherbar
Verwendung:
Schaltflächen (Buttons) |
Aufzählungszeichen (Dots) |
Trennleisten (Bars) |
Symbole Textersatz |
Cliparts (Illustrationen) |
---|---|---|---|---|
|
|
|
|
|
Theoretisch kann jede der 256 Farben beliebige RGB-Werte haben,
d.h. es sind auch "krumme" Farbwerte wie 71,217,34 denkbar.
Für WWW-gerechte GIF-Grafiken gibt es ein Standard-Schema.
Bei diesem Schema sind alle Farben erlaubt, deren RGB-Werte durch 51 teilbar
sind.
R(ot), G(rün) und B(lau) sollten danach also einen der Werte
0, 51, 102, 153, 204 oder 255
(hexadezimal: 00, 33, 66, 99, CC oder FF) haben.
Auf diese Weise ergeben sich 6 x 6 x 6 mögliche Farben, also 216.
Die verbleibenden 40 Farben sind "eiserne Reserve".
Die folgende Abbildung zeigt alle 216 Farben des Standard-Schemas.
Es wurde entwickelt von der Joint Photographic Expert Group.
Vorteile:
Nachteil: mit Verlust komprimiert, d.h. je höher der Kompressionsfaktor, desto schlechter die Qualität der Grafik.
Verwendung:
PNG bedeutet Portable Network Graphic.
Es vereint alle Vorteile von GIF und JPG:
<IMG src = "datei.gif"> | Grafik im gleichen Verzeichnis |
<IMG src = "bilder/datei.gif"> | Grafik im Unterordner bilder |
Attribute im IMG-Tag | Wert(e) | Beschreibung |
---|---|---|
align | top, middle, bottom | Ausrichtung der Bildbeschriftung |
alt | "Text" | Anzeige eines Alternativtextes |
border | Zahl | Rahmenstärke in Pixel |
height | Zahl | Bildhöhe in Pixel |
hspace | Zahl oder Zahl% | Horizontaler Abstand zu weiteren Elementen |
lowsrc | "bild.gif" | Zuerst Grafik geringerer Farbtiefe laden |
vspace | Zahl oder Zahl% | Vertikaler Abstand zu weiteren Elementen |
width | Zahl | Bildbreite in Pixel |
Um Bilder horizontal auszurichten, muss man sie in einen Absatz oder Container einbinden.
z.B.: <div align="right"> <IMG src="bild.jpg"></div>
<body background = "datei.gif"> | Grafik im gleichen Verzeichnis |
<body background = "bilder/datei.gif"> | Grafik im Unterordner bilder |
Aufgabe:
Erstelle das HTML-Dokument 06_Bilder.html welches unten abgebildete Web-Seite liefert! Beachte dabei folgende Formatierungshinweise: