Alphabetische Liste der HTML- und XHTML-Elemente

(Auszug aus "HTML & XHTML ─ kurz & gut" von Jennifer Niederst Robbins)

A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

   

img

HTML 4.01 | HTML 5

HTML: <img>; XHTML: <img/> oder <img />

Platziert ein Bild auf der Seite. Die Attribute src und alt sind immer erforderlich. Viele Attribute für die Darstellung und Positionierung des img-Elements gelten zugunsten der Verwendung von Stylesheets als veraltet.

Start-/End-Tag

Dies ist ein leeres Element. In HTML ist das End-Tag verboten. In XHTML muss das Element mit einem Schrägstrich vor der schließenden spitzen Klammer abgeschlossen werden. Entwickler können vor dem Schrägstrich ein Leerzeichen einfügen, um die Rückwärtskompatibilität mit älteren Browsern zu verbessern.

Attribute

Kern, Internationalisierung, Events, globale HTML 5-Attribute

  • align="bottom|left|middle|right|top"

    Veraltet. Nicht in HTML 5. Legt die Ausrichtung des Bildes anhand der folgenden Werte fest:

    Wert Resultierende Ausrichtung
    bottom Richtet das Bild an der Text-Grundlinie aus. Dies ist der Standardwert für die vertikale Ausrichtung.
    left Richtet das Bild am linken Rand des umgebenden Elements aus. Auf das Bild folgender Text kann das Bild umfließen.
    middle Richtet die Text-Grundlinie an der Mitte des Bildes aus.
    right Richtet das Bild am rechten Rand des umgebenden Elements aus. Auf das Bild folgender Text kann das Bild umfließen.
    top Richtet die Oberkante des Bildes an der Oberkante des höchsten Objekts der Zeile aus.

    Tabelle: mögliche Werte des align-Attributs vom img-Element

  • alt="Text"

    Erforderlich. Stellt einen kurzen alternativen Text bereit, der angezeigt wird, wenn das Bild nicht dargestellt werden kann. Browser können diesen Text als Tooltip darstellen, wenn sich der Mauszeiger über dem Bild befindet.

  • border="Zahl"

    Veraltet. Nicht in HTML 5. Definiert die Breite des Rahmens (in Pixeln), der ein verlinktes (innerhalb von <a> ... </a>-Tags befindliches) Bild umgibt.

  • height="Zahl"

    Gibt die Höhe des Bildes in Pixeln an. Dieses Attribut ist nicht erforderlich. Seine Verwendung wird aber empfohlen, um die Darstellung der Webseite zu beschleunigen.

  • hspace="Zahl"

    Veraltet. Nicht in HTML 5. Definiert den Leerraum (in Pixeln), der links und rechts vom Bild frei gelassen werden soll.

  • ismap (ismap="ismap" in XHTML)

    Zeigt an, dass das Bild bzw. die Grafik als Basis für eine serverseitige Imagemap (ein Bild, das eine Reihe von Hyperlinks enthält) verwendet werden soll.

  • longdesc="URL"

    Nicht in HTML 5. Enthält einen Link auf ein Dokument mit einer langen Inhaltsbeschreibung des Bildes bzw. der Imagemap. Kann verwendet werden, um Informationen zum Bild für nicht-visuelle Browser zugänglich zu machen. Dieses Attribut wird nicht besonders gut unterstützt.

  • lowsrc="URL"

    Nicht standardkonform. Verweist auf ein Bild (normalerweise mit geringerer Dateigröße), das zuerst heruntergeladen wird, bevor das mit dem src-Attribut angegebene Bild geladen wird. Dies war nützlich, als die Internetverbindung hauptsächlich über telefonische Einwahlverbindungen realisiert wurde. Wird heutzutage kaum noch benutzt.

  • name="Text"

    Veraltet in XHTML 1.0. Nicht in HTML 5. Verwenden Sie stattdessen das Attribut id. Weist dem Bild einen Namen zu, über den es von Skripten oder Stylesheets referenziert werden kann.

  • src="URL"

    Erforderlich. Gibt den Speicherort (URL) des anzuzeigenden Bildes an.

  • usemap="URL"

    Gibt den Speicherort der Koordinaten und Links für eine client-seitige Imagemap an (ein Bild, das mehrere Hyperlinks enthalten kann).

  • vspace="Zahl"

    Veraltet. Nicht in HTML 5. Gibt an, wie viel Leerraum (in Pixeln) ober- und unterhalb des Bildes frei gelassen werden soll.

  • width="Zahl"

    Gibt die Breite des Bildes in Pixeln an. Dieses Attribut ist nicht erforderlich. Seine Verwendung wird aber empfohlen, um die Darstellung der Webseite zu beschleunigen.

Beispiel (HTML)

<p>Das ideale Haustier: <img src="schwein.gif" height="200" width="400" alt="Ein Schwein"></p>

Beispiel (XHTML)

<p>Das ideale Haustier: <img src="schwein.gif" height="200" width="400" alt="Ein Schwein" /></p>
Tipp der data2type-Redaktion:
Zum Thema HTML & XHTML bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright © 2010 O’Reilly Verlag GmbH & Co. KG
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "HTML & XHTML ─ kurz & gut" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

O’Reilly Verlag GmbH & Co. KG, Balthasarstraße 81, 50670 Köln, kommentar(at)oreilly.de