HTML: Bilder einfĂŒgen

28. MĂ€rz 2016 von | Kategorie(n): Programmierung
Schlagwörter: // //

Also gut… Du kannst jetzt zwar Text und Überschriften in deinem Browser anzeigen (wenn nicht: Schau hier). Aber ohne Bilder ist es an der ein oder anderen Stelle langweilig. Und außerdem: Ein Bild sagt mehr als 1000 Worte.

DafĂŒr gibt’s doch bestimmt auch einen Tag, oder?

Richtig! <img src=“Dateiname.jpg“ />

Auf Wunsch kann auch noch die Breite sowie Höhe (uvm.) des Bildes festgelegt werden, aber als Basis funktioniert dieser Tag so. Des Weiteren können auch andere Bilddateitypen verwendet werden.

<html>
    <head>
        <title> Bild !!! </title>
    </head>
    <body>
        <h1> Ein Bild Urlaubsbild... </h1>
        <img src="amsterdam2016.JPG" width="300" height="200" />
    </body>
</html>

Ansehen

ErklĂ€rung: Der img-Tag bindet Bilder ein. Dabei steht img fĂŒr image (engl. fĂŒr Bild). Dieser Tag kennt, und das ist neu, im Gegensatz zu dem p-Tag und den Überschriften, Attribute. Diese sind src, width & height (es gibt noch mehr ;-)):

  • src: ein absoluter oder relativer Pfad zum Bild (im Beispiel oben ist es ein relativer, da nur der Dateiname angegeben ist. Dies bedeutet wiederum, dass Bild und HTML-Datei in dem  selben Order liegen.
  • width: Die Breite des Bildes (in Pixeln)
  • height: Die Höhe des Bildes (in Pixeln)

FĂŒr den Anfang sollte das erst einmal reichen 🙂 Wer Lust hat kann ja das bereits gelernte (Texte und Überschriften) in eine Datei bringen und so verbinden. Übung macht den Meister.

 

<Tim Poerschke />

Was denkst du ĂŒber diesen Post?
  • Gut (0)
  • Hilfreich (0)
  • Nicht gut (0)
  • Lustig 😀 (0)
Diesen Post teilen:
Facebooktwittergoogle_plusredditpinterestlinkedinmail

Schreibe einen Kommentar

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

43 − = 39