PDF herunterladen
PDF herunterladen
Die Ausrichtung von Bildern ist eine wichtige Fähigkeit beim Programmieren von Webseiten. Leider sind mit der Veränderung des Codes manche HTML Tags überholt und werden nicht mehr von allen Browsern erkannt. Versuche es mit diesen Methoden, um in HTML ein Bild zu zentrieren. Wenn sie nicht funktionieren, erwäge die Verwendung von Cascading Style Sheets (CSS).
Vorgehensweise
-
Verwende in deinem Tag nicht das Wort “center”. In der HTML-Programmierung kannst du Text zentrieren, aber du musst die Ausrichtung von Bildern mit dem Wort “middle” angeben. Ein Bild ist kein Zeilenelement, daher wird es im Verhältnis zu anderen Elementen erkannt.
-
Gehe in eine neue Zeile. Gib mit dem Absatz-Tag an, dass eine neue Zeile beginnt. Beginne dein Tag mit <p> und schreibe dann deinen Text.
-
Füge das Bild ein, indem du <img src=”imgName. gif” eingibst. Gib dann die Bildbeschreibung ein mit alt=”Bildbeschreibung” .
- Mit dem “src” Teil bekommt die Webseite die URL des Bilds.
- Mit dem "alt" Teil erkennt die Webseite, wie das Bild bezeichnet werden soll.
-
Gib die Ausrichtung deines Bilds an. Tippe align=”middle”> ein. Dies ist das Ende des Bildbereichs deines Tags. [1] X Forschungsquelle
-
Füge mehr Text hinzu. Schließe den Tag dann mit </p>. Der gesamte Tag könnte z. B. so aussehen: <p>Wir lernen HTML. <img src=”bildtanzenderhund.gif” alt=”tanzender Hund” align=”middle> Unser Beispiel ist abgeschlossen. </p>Werbeanzeige
-
Erstelle ein neues Element und zentriere es. Du kannst das Bild in dieses zentrierte Element einfügen. Es werden allerdings zusätzliche Leerzeichen um dein Element herum eingefügt.
-
Gehe in eine neue Zeile. Beginne mit dem Zentrieren des Elements. Tippe <center> ein.
-
Füge dein image tag hinzu. Tippe <img src=”bildtanzenderhund.gif” alt=”tanzender Hund” ein.
-
Gib die Höhe und die Breite des Bilds an. Gib height=”200” width=”200”> oder eine andere Größe deiner Wahl ein. Dies ist das Ende des image-Teils des Tags.
-
Beende dein Tag mit </center>. Der gesamte Tag würde z. B. so aussehen:
<center><img src=”bildtanzenderhund.gif” alt=”tanzenderhund” height=”200” width=”200”></center>. [2] X ForschungsquelleWerbeanzeige
Warnungen
- Sei dir darüber bewusst, dass sowohl das align- als auch das center-Tag veralten können. Dies bedeutet, dass sie in der Zukunft nicht mehr benutzt werden. Auch wenn es kein genaues Datum gibt, wann deren Verwendung eingestellt wird, Browser werden sie irgendwann nicht mehr erkennen und der Code muss auf CSS oder HTML5 aktualisiert werden.
Werbeanzeige
Referenzen
Werbeanzeige