原文连接：
（本文来源于图老师网站，更多请访问https://m.tulaoshi.com/webkaifa/） 图片自动等比例缩小，其实如果不考虑ie6的话，用css就可以实现，设定img的max-width和max-height，而img标签内不设定widht和height即可。
ie7已经支持max-width和max-height，这是为数不多的好消息之一。 但是对于ie6及以前的版本，就只能用js来设置了。
在 ff 2.0/ ie6 / ie7 中测试通过。 opera 8.5 cn 垂直居中未通过，正在研究[貌似opera下如果只有图片行高会失效]。希望大家来测试。
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
title图片自动等比例缩小且垂直居中/title
!--[if lte IE 6]
script type="text/javascript" language="javascript"
function imgFix() {
//定义要限制的图片宽高,这个宽高要同style里面定义的相同，小于限定高宽的图片不操作
var widthRestriction = 200;
var heightRestriction = 200;
var allElements = document.getElementsByTagName('*')
for (var i = 0; i allElements.length; i++)
{
if (allElements[i].className.indexOf('imgBox') = 0)
{
var imgElements = allElements[i].getElementsByTagName('img');
for (var j=0; j imgElements.length; j++)
{
if ( imgElements[j].width widthRestriction || imgElements[j].height heightRestriction )
{
if ( imgElements[j].width imgElements[j].height)
{
imgElements[j].height = imgElements[j].height*(widthRestriction/imgElements[j].width);
imgElements[j].width = widthRestriction;
} else
{
imgElements[j].width = imgElements[j].width*(heightRestriction/imgElements[j].height);
imgElements[j].height = heightRestriction;
}
}
if ( imgElements[j].height heightRestriction )
{
imgElements[j].style.paddingTop = ( heightRestriction -imgElements[j].height ) /2 + "px";
}
} /*for j*/
}
}/*for i*/
}
window.onload = imgFix;
/script
![endif]--
style type="text/css"
!--
* {
margin:0;
padding:0;
}
.imgBox li {
list-style:none;
width:200px; /* 宽度 */
height:200px; /* 高度 */
background:#ccc;
border:1px solid #666;
text-align:center;
margin:5px;
line-height:200px;
}
.imgBox img {
max-width:200px; /* 宽度 */
max-height:200px; /* 高度 */
vertical-align:middle;
}
--
/style
/head
body
ul class="imgBox"
liimg src="......" alt="img" //li
liimg src="......" alt="img" //li
liimg src="......" alt="img" //li
liimg src="......" alt="img" //li
/ul
/body
/html
