Bildbreite in HTML

Standardmäßig werden Bilder in ihrer tatsächlichen Größe angezeigt. Zum Beispiel hat das Bild mit dem Smiley, das wir oben ausgegeben haben, eine tatsächliche Größe von 130 mal 130 Pixel, und diese Größe sehen wir auch im Browser.

Bei Bedarf kann die Bildgröße geändert werden, indem man ihm eine Breite zuweist. Dies geschieht mit dem Attribut width.

Lassen Sie uns als Beispiel unserem Bild eine Breite von 100 Pixeln zuweisen. Dazu geben wir als Wert des Attributs width die Zahl 100 an, so wie hier:

Welche Größe wird das Bild dann auf dem Bildschirm haben? Man könnte meinen, Folgendes: Breite 100 Pixel, wie wir festgelegt haben, und die tatsächliche Höhe von 130, da wir diese nicht angegeben haben. Tatsächlich wird es aber nicht so sein.

Die Breite wird tatsächlich 100 Pixel betragen, aber die Höhe passt sich so an, dass die Proportionen des Bildes nicht verzerrt werden, sie wird also ebenfalls 100 Pixel betragen.

Lassen Sie uns das ausführen und davon überzeugen:

: