Alles klar soweit !?

Sie befinden sich hier:

Kommen wir in diesem Teil zum Einf├╝gen von Bildern.

Um ein Bild/Image einzuf├╝gen ben├Âtigen wir den Tagnamenimg“, das Verzeichnis in “src” und die Titelangabe durch “alt“. (Beispiel 1)

<img src="bild.png" alt="Beispielbild">

Das Verzeichnis kann die URL des Bildes enthalten oder das Verzeichnis, wenn es bei euch auf dem Server liegt. Tipps zum Verzeichnisaufbau findet ihr im n├Ąchsten Artikel zu den Links.

Hinweise:

  • Es wird kein schlie├čendes Tag ben├Âtigt!
  • das Attribut alt ist zwingend anzugeben!

Zul├Ąssige Dateitypen:

  • JPEG (*.jpg, *.jpeg)
  • PNG (*.png)
  • GIF (*.gif)

Hinweis:

  • Wir empfehlen den Einsatz von Bildern des Typs PNG oder JPG. PNG hat eine h├Âhere Qualit├Ąt, allerdings ist die Dateigr├Â├če mehr als bei JPGs.

Popup des Titels (Beispiel 2)

Ihr k├Ânnt den Titel des Bildes angeben um zu erreichen, dass beim “Mouseover” der Titel erscheint

<img src="bild.png" alt="Beispielbild" title="Titel des Beispielbildes">

Rahmen um Bilder (Beispiel 3)

Bei den Bildern ist es wie bei den Tabellen. Um diesen einen Rahmen zu geben verwenden wir das Attribut “border”.

<img src="beispiel.png" alt="Beispielbild" border="4px solid #000">

Bildbreite und H├Âhe bestimmen (Beispiel 4)

Auch hier verwenden wir wieder Attribute. Und zwar “width” f├╝r die Breite und “height” f├╝r die H├Âhe.

<img src="beispiel.png" alt="Beispielbild" width"50px" heigth="50px">

Wichtig!!!

Alle Formatierungen bzw. stilistische Gestaltungen k├Ânnen ebenfalls ├╝ber CSS eingestellt werden. Dies ist zum Einen ├╝bersichtlicher und zum Anderen einfacher zu steuern.

 

Ihr habt noch Fragen oder Anregungen, dann schreibt uns einfach eine E-Mail ├╝ber unser Kontaktformular oder kommentiert diesen Beitrag!

Alles klar soweit !?

 

vorheriger Artikel: n├Ąchster Artikel:
» «

Geschrieben am: 27. Mai 2013 um 12:38 // Thema: HTML //  Kommentar verfassen

Auf dieses Thema gibt es noch keine Reaktion

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht ver├Âffentlicht. Erforderliche Felder sind markiert *




Impressum // KlaroBox // die kostenlose Lernkiste