Skalieren von Bildern ist simpel und bedarf nur einer kleinen Zeile Code, die ihr euch hier gerne rauskopieren dürft.
<img src="BILDLINK" style="width: BILDBREITE;" />
Die Breite könnt ihr in Pixel angeben (zB. 150px) oder in Prozent (zB. 34%). Bei Prozent ist darauf zu achten, dass von der Gesamtgröße des Elements ausgegangen wird, welches das Bild umschließt.
Skaliert ihr nur mit der Breite, wird die Höhe des Bildes automatisch im richtigen Verhältnis angepasst.
Im folgenden ein paar Beispiele zur Veranschaulichung: Die Originalgröße von Kon beträgt 1748x2480 Pixel
Breite mit Pixelangabe Code: <img src="kon.png" style="width:200px;" /> | |
Breite mit Prozentangabe 40% Code: <img src="kon.png" style="width:40%;" /> | |
Breite mit Prozentangabe 100% Code: <img src="kon.png" style="width:100%;" /> |
Falls das Bildformat trotz Skalierung der Breite nicht in euer Raster passt, weil es zum Beispiel noch zu hoch ist, könnt ihr auch die Höhe indiviuell anpassen.
<img src="BILDLINK" style="width: BILDBREITE; height: BILDHÖHE;" />
Breite und Höhe im richtigen Verhältnis Code: <img src="kon.png" style="width:200px; height:284px;" /> | |
Breite und Höhe im falschem Verhältnis Code: <img src="kon.png" style="width:200px; height:350px;" /> |