Bildgröße proportional mit CSS ändern?

Question

Gibt es eine Möglichkeit, die Größe von Bildern proportional zu ändern (zu verkleinern), indem man nur CSS verwendet?

Ich mache den JavaScript-Weg, aber ich versuche nur zu sehen, ob dies mit CSS möglich ist.

Answer 1

Sie brauchen immer etwas wie das hier

html
{
    width: 100%;
    height: 100%;
}

am Anfang Ihrer css-Datei

Answer 2

Versuchen Sie dies:

div.container {
    max-width: 200px;//real picture size
    max-height: 100px;
}

/* resize images */
div.container img {
    width: 100%;
    height: auto;
}

Answer 3

image_tag("/icons/icon.gif", height: '32', width: '32') Ich brauche, um Höhe zu setzen: '50px', Breite: '50px' zu Bild-Tag und dieser Code funktioniert von ersten Versuch beachten Sie, dass ich alle oben genannten Code versucht, aber kein Glück, so dass dieser funktioniert und hier ist mein Code von meinem _nav.html.erb:
<%= image_tag("#{current_user.image}", height: '50px', width: '50px') %>