Bild einfügen

Wie kommt das Bild auf eine Website?

  • Erstelle einen Ordner mit Namen "bilder" im Ordner in dem du auch die HTML-Dateien für diese Lektion hast.
  • Speichere die GIF-Grafik und das JPG-Foto von der vorherigen Seite in diesem Ordner ab. Einfach mit einem Rechtsklick auf das Bild klicken, auf "Bild speichern unter... " gehen und dann abspeichern (Beim Mac: Control-Taste und Mausklick auf das Bild). Benenne das Gif-Bild beim Abspeichern *gifbild.gif* und das JPEG-Bild *jpgbild.jpg*
  • Erstelle eine HTML-Datei mit folgendem Quellcode:

<html>
<head>
<title>Die f&uuml;nfte Lektion</title>
</head>
<body bgcolor="#666666" text="#FFFFFF">
<p align="center"><img src="bilder/jpgbild.jpg"></p>
<h2 align="center">Ein buntes JPEG-Bild!</h2>
</body>
</html>~

  • Benenne die Datei *lektion51.htm*
  • Öffne die Datei *lektion51.htm* im Browser. So in der Richtung sollte es aussehen:

  • <img src="bilder/jpgbild.jpg">~
    Für diesem Tag benötigt ihr ausnahmsweise keinen End-Tag (Wie bei
    ~). img~ steht für Image (image = Bild), src~ steht für source (source = Quelle)
  • Als src-Wert zwischen den Anführungszeichen muß die Quellenangabe stehen. Wenn das Bild im gleichen Ordner wie die HTML-Datei wäre, würde hier nur jpgbild.jpg~ stehen. Da ihr das Bild aber noch in einen Ordner mit Namen "bilder" verschoben habt, steht vor dem Bildnamen also der Ordnername bilder/jpgbild.jpg~