resize an image in proportion with CSS, is it possible?

Question

Is there a way to resize images retaining their proportions with CSS?

The container has a fixed width and height

   

        

                      

              相关标签:
       
      

Answer 1

.theimage{
    width:100%;
    height:auto;
}

or

.theimage{
    width:auto;
    height:100%;
}

Depending on how you wanna give the scale preference... :) :)

Thats all.

Answer 2

To save the Image ratio while scaling you can use object-fit CSS3 propperty.

Useful article: Control image aspect ratios with CSS3

img {
    width: 100%; /* or any custom size */
    height: 100%; 
    object-fit: contain;
}