Beispiel
Wie ein Bild einzufügen:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
Versuch es selber " Mehr "Versuchen Sie es selbst" Beispiele unten.
Definition und Verwendung
Das <img> Tag definiert ein Bild in einer HTML - Seite.
Das <img> Tag hat zwei erforderlichen Attribute: src und alt .
Hinweis: Bilder werden nicht technisch in eine HTML - Seite eingefügt, werden die Bilder auf HTML - Seiten verlinkt sind .Das <img> -Tag erzeugt einen Halteraum für das referenzierte Bild.
Tipp: Um ein Bild auf ein anderes Dokument verknüpfen, einfach Nest das <img> Tag in <a> Tags.
Browser-Unterstützung
| Element | |||||
|---|---|---|---|---|---|
| <img> | ja | ja | ja | ja | ja |
Unterschiede zwischen HTML 4.01 und HTML5
Die following Attribute: align, border, hspace und vspace sind nicht in HTML5 unterstützt.
Unterschiede zwischen HTML und XHTML
In HTML das <img> hat Tag kein Ende - Tag.
In XHTML das <img> Tag richtig geschlossen werden müssen.
Attribute
= Neu in HTML5.
| Attribut | Wert | Beschreibung |
|---|---|---|
| align | top bottom middle left right | Nicht in HTML5 unterstützt. Gibt die Ausrichtung eines Bildes gemäß umgebenden Elementen |
| alt | text | Gibt einen alternativen Text für ein Bild |
| border | pixels | Nicht in HTML5 unterstützt. Gibt die Breite des Rahmens um ein Bild |
| crossorigin | anonymous use-credentials | Allow Bilder von Websites von Drittanbietern, die Cross-Origin-Zugang ermöglichen, mit Leinwand verwendet werden |
| height | pixels | Gibt die Höhe eines Bildes |
| hspace | pixels | Nicht in HTML5 unterstützt. Gibt die Leerzeichen auf der linken und rechten Seite eines Bildes |
| ismap | ismap | Gibt ein Bild als serverseitige Bild-Karte |
| longdesc | URL | Gibt eine URL auf eine detaillierte Beschreibung einer Bild |
| src | URL | Gibt die URL eines Bildes |
| usemap | #mapname | Gibt ein Bild als eine clientseitige Bild-Karte |
| vspace | pixels | Nicht in HTML5 unterstützt. Gibt die Leerzeichen oben und unten im Bild |
| width | pixels | Gibt die Breite eines Bildes |
globale Attribute
Das <img> Tag unterstützt auch der Globale Attribute in HTML .
Event-Attribute
Das <img> Tag unterstützt auch der Event Attribute in HTML .
Probieren Sie es selbst - Beispiele
Fügen Sie Bilder von verschiedenen Standorten aus
Wie man Bilder aus einem anderen Ordner oder von einer anderen Website einzufügen.
Machen Sie einen Hyperlink eines Bildes
Wie einen Hyperlink zu einem Bild hinzuzufügen.
Erstellen Sie ein Bild Karte
Wie ein Bild der Karte, mit anklickbaren Regionen zu schaffen. Jede Region ist ein Hyperlink.
Verwandte Seiten
HTML - Tutorial: HTML Images
HTML - DOM - Referenz: Bildobjekt
CSS Tutorial: Styling Bilder
Standard CSS-Einstellungen
Die meisten Browser erscheint auf dem Display <img> mit den folgenden Standardwerte Element: