HTML-Bilder

HTML Teil 17 Anleitung HTML Bilder (Images)

HTML Bilder werden mit dem Tag <img> eingefügt.

Die <img> Attribute:

src= Ist der Verweis zum Bild
alt= Beschreibung des Bildes (wird von Sreen Readers vorgelesen)
style= Hier wird die Größe und Position des Bildes definiert.
Man kann die Größe auch ohne dem Attribut style angeben. (Ist aber nicht empfohlen)

Image Floating (Textfluss um das Bild)

Mit dem style Attribute im <img> Tag, kann man den Text neben und um das Bild stellen.
Beispiel:

Mein AutoDas Bild steht auf der linken Seite und der Text sthet auf der rechten Seite neben dem Bild.


 

 

 

Image <img> Maps Koordinaten am Bild verlinken.

Man kann ein Bild in mehrer Teile aufteilen und diese dann unterschiedlich verlinken. Es wird eine Karte über das Bild geleget. Sehr oft findet man diese Maps bei Landkarten, wenn man zu verschiedenen Orten verlinken will.

Das Attribute usemap= gibt den Namen der Karte an.
Mit dem Tag <map> </map> wird das Koordinatensystem angelegt.
Hier gibt man dann mit dem Attribut <area shape= die Form an.
Es gibt:
rect = Rechteck
circle = Kreis
poly = Vieleck
Unter coords= werden die Koordinaten angegeben.
Koordinaten rect = Rechteck
x1,y1,x2,y2
x1 = linke obere Ecke in Pixel von links
y1 = linke obere Ecke in Pixel von oben
x2 = rechte untere Ecke in Pixel von links
y2 = rechte untere Ecke in Pixel von oben
Koordinaten circle = Kreis
x,y,r
x = Mittelpunkt in Pixel von links
y = Mittelpunkt in Pixel von oben
r = Radius in Pixel
Koordinaten poly = Vieleck
x1,y1,x2,y2,x3,y3,x4,y4….
x1 = linke obere Ecke in Pixel von links
y1 = linke obere Ecke in Pixel von oben

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

*