Javascript 根据父div大小按比例调整图像大小

我正在使用全浏览器宽度高度jquery blockUI显示从库中选择的图像。下图是blockUI中的视图模式。
侧块UI中的基本视图的宽度和高度设置为100%。
里面还有两个div。右侧的宽度设置为视图的80%，并且包含图像。
图像的宽度和高度设置为100%（但我知道这是错误的）。
我在这里显示的图像是用户上传的原始大小的图像。但如果显示器是1024x768，上传的图像是600x1900，我不知道该图像的内容会从屏幕上消失。
那么，我该如何解决这个问题以显示居中且成比例的图像呢

---

使用

max width

和

max height

，如果需要支持IE 6，则需要在IE 6中使用JavaScript：

#blockUI img {
    max-width: 100%;
    max-height: 100%;
}

这样可以在调整大小时将

img

元素的纵横比保持在最大可能的宽度和高度