Make image smaller and preserve proportions?

I have a table column where I have this image displayed:

 <table width="200px" height="300px" align="center">
  <tr>
   <td><img src="...."></td>
  </tr>
 </table>

The image source is dynamic, so the image is开发者_如何学Python not always the same size...

This means I have to (in most cases) resize the image to become smaller than it is.

How can I do this while preserving the proportions, in the easiest way?

Thanks

Just set a width.

<img src="..." style="width: 200px">

the proportions will be preserved automatically if you specify only one dimension.

Aspect ratio should be preserved if you specify either a width or a height, but not both, in your <img> element's style:

If the specified size is just a definite width or just a definite height, then the CSS View Box must have the same width or height, as appropriate. The other dimension is calculated as follows:

1. If the object has an intrinsic aspect ratio, the CSS View Box must have the same aspect ratio.

have you tried the % instead of width/height in px ie.

<img src="..." style="width: 90%">

Put id="imageID" on your img tab and call the following javascript:

  var elem = document.getElementById('imageID');
  if (elem == undefined || elem == null) return false;
  if (max == undefined) max = 100;
  if (elem.width > elem.height) {
    if (elem.width > max) elem.width = max;
  } else {
    if (elem.height > max) elem.height = max;
  }