Saving image proportions using CSS or jQuery?

Question

I have images whose size is (900x512). Since I'm going to make it responsive so that the images need to be adjusted within this proportional width of the screen !!

Answer 1

Using:

<img src="..." style="width: 100%; height: auto;" />

this will keep the proportions. height: autowill be sure it is heightnot set anywhere (as cale_b mentioned)

Answer 2

If you use bootstrap, you can add a class img-responsiveto your images.

This class applies the following css properties

• Maximum Width: 100%
• Height: auto
• Display: Unit

:

<img class="img-responsive" alt="My image" >

: http://getbootstrap.com/css/#images-responsive

Answer 3

, CSS.

.image{
  width: 40%;
  border: 1px solid #ffffff;
}