Bilder verfeinert

Beim Einfügen von Bildern mit der bisher beschriebenen Methode weiß der Browser erst nachdem er das Bild geladen hat, wie groß dieses ist. Er muss also den Text umformatieren. Dafür gibt es Abhilfe: Die Attribute width= für die Breite und height= für die Höhe des Bildes.

Doch aufgepasst: Falls Höhen- und Breitenangabe nicht mit der Höhe und Breite des Bildes übereinstimmen, wird das Bild entsprechend konvertiert. Die dafür notwendige Rechenarbeit muss der Browser übernehmen!

Beim Verwenden eines Bildes als Link auf eine andere Webseite fällt auf, dass automatisch ein Rahmen um dieses Bild gezeichnet wird. Dies können wir unterdrücken, indem wir das Attribut border="0" verwenden.

Ein Image-Tag, dass das UCC-Logo in halber Größe einbindet und ohne Rahmen auf die Homepage des UCC verweist, sieht so aus:

<a href="http://uccnet.de">
<img src="/fileadmin/images/ucc_small.png" alt="UCC-Logo"
width="108" height="39" border="0"
title="UpToDate Computer Club e.V."></a>
UCC-Logo

Aufgabe: Bilder verfeinert

Entferne bei der Lösung der Aufgabe zu Bilder den Rahmen


Creative Commons License
Dieser Inhalt ist unter einer Creative Commons-Lizenz lizenziert.