HTML

Bilder lassen sich u.a. mit dem img-Element darstellen. Das Attribut src gibt dabei die URLder anzuzeigenden (Bild-)Datei an. Verwendet werden können fast alle Bildformate, üblich sind aber *.gif und *.jpg/*.jpeg. Beispiel:




Bitte beachten Sie dabei, dass das img-Element kein schließendes Tag hat, allerdings ist es nicht falsch dieses zu notieren, da er einfach vom Browser übergangen wird.
Bildtext

Das title-Attribut des img-Elements gibt den Bildtext an. Dieser wird angezeigt sobald man die Maus etwa 2 Sekunden über das jeweilige Bild hält. Der Bildtext kann als Beschreibung des Bildes dienen oder um zusätzliche Informationen dazu zu geben.
Außerdem kann das alt-Attribut als Alternativtext verwendet werden. Dieser Text wird immer dann angezeigt wenn das Bild aus irgendeinem Grund nicht angezeigt werden kann. Nützlich ist es auch wenn die Dokumente auch von beinträchtigten Personen komplett verstanden werden sollen (z.B. kann der Alternativtext eine Erklärung dazu geben, was auf dem Bild zu sehen, damit auch sehbeeinträchtige Menschen alles mitbekommen). Beispiel:

einem Baum title=Der Affe mag den Baum>

Des Weiteren kann auch eine, sozusagen externe, Beschreibung des Bildes existieren. Diese kann mit dem longdesc-Attribt referenziert werden indem man dieURLbzw. sonstige Adresse als Wert angibt. Beispiel:

longdesc=bildbeschreibung.htm#bild3>
Bildmaße

Um die Bildmaße (die Größe des Bildes) zu bestimmen gibt es zwei Attribute: Das height-Attribut, welches die Bildhöhe bestimmt, und das width-Attribut, welches die Bildbreite bestimmt. Beide können Angaben in Pixeln oder Prozent enthalten. Werden diese Attribute nicht verwendet wird das Bild in seiner vom Browser dargestellten Normalgröße ausgegeben. Beispiel:



Bildausrichtung

Bilder können ebenso wie z.B. Text mit dem align-Attribut ausgerichtet werden. Hier sind folgende Werte möglich:

* left - Bild wird links ausgerichtet
* center - Bild wird zentriert ausgerichtet
* right - Bild wird rechts ausgerichtet

Berispiel:




Des Weiteren kann eine vertikale Ausrichtung bezüglich des darauffolgenden Textes vorgenommen werden. Dies wird ebenfalls mit dem align-Attribut vorgenommen. Als Werte sind folgende denkbar:

* top - Der folgende Text wird über dem Bild angezeigt.
* middle - Der folgende Text wird neben dem Bild angezeigt.
* bottom - Der folgende Text wird unter dem Bild angezeigt.

Beispiel:

ein Bild

Eine Kombination der beiden Möglichkeiten ist durch Trennung durch Komma (,) oder Leertaste möglich. Beispiel:

ein Bild
Bildrahmen

Um Rahmen um Bilder zu legen, kann das border-Attribut verwendet werden. Die Angaben der Rahmenbreite können hierbei in Pixeln notiert werden - voreingestellt ist 1 Pixel Breite. Beispiel:



Bildabstand

Um den Abstand des jeweiligen Bildes zu anderen Objekten festzulegen gibt es zwei Attribute. Das vspace-Attribut beschreibt den vertikalen Abstand (überhalb und unterhalb des Bildes). Das andere Attribut ist das hspace-Attribut, welches den horizontalen Abstand beschreibt (rechts und links neben dem Bild). Die Angaben können entweder in Pixeln oder in Prozent notiert werden. Beispiel:




Bitte beachten Sie dabei, dass nicht alle Browser dieses Attribut korrekt darstellen können