HTML/IE:拉伸图像以适应,保持纵横比

Question

在HTML窗口中,我正在设置自定义正文

<img src="file://[filename]">

显示图像

现在我想拉伸图像以适应可用窗口,但保留纵横比.

<img src="file://[filename]" width="100%" height="100">

延伸但也扭曲了图像.

是否有一些HTML技巧可以做到这一点？IE唯一的解决方案很好,因为这是在托管的浏览器控件中.

Answer 1

如果要保留纵横比,只需指定一个维度即:

<img src="file://[filename]" width="100%" alt="" />

您可以使用javascript确定最大尺寸并相应调整大小

<script type="text/javascript">
function getImgSize(id){
var pic = document.getElementById(id);
var h = pic.offsetHeight;
var w = pic.offsetWidth;
alert ('The image size is '+w+'*'+h);
}
</script>

Answer 2

如果您知道高度或宽度,则只能设置它.另一个尺寸将根据图像的纵横比自动设置.