| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>未知大小图片垂直和水平居中</title>
< http-equiv="Content-Type" content="text/html; charset=gb2313" />
< name="KEYWords" content="图片垂直居中，水平居中" />
<style type="text/css" media="screen">
<!--
.box { width:650px; border:#999999 solid 1px; }
-->
</style>
<>
imgCenter(_event){
var tagdiv=_event.parentNode;
if (tagdiv.nodeName=="A"){
tagdiv=tagdiv.parentNode;
}
divw=parseInt(all?tagdiv.currentStyle.width:getComputedStyle(tagdiv,null).width);
imgw=_event.width;
imgmleft=(divw-imgw)/2;
_event.style.display='block';
_event.style.margin=imgmleft+'px auto';
}
//图片自动缩放
var flag=false;
/**
* ImgD：原图
* maxWidth：允许的最大宽度
* maxHeight：允许的最大高度
*/
DrawImage(ImgD, maxWidth, maxHeight){
var image=new Image();
var iwidth = 600; //定义允许图片宽度
var iheight = 800; //定义允许图片高度
image.src="/blog/ImgD.src";
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>= iwidth/iheight){
if(image.width>iwidth){
ImgD.width=iwidth;
ImgD.height=(image.height*iwidth)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt="图片尺寸："+image.width+"×"+image.height;
} else{
if(image.height>iheight){
ImgD.height=iheight;
ImgD.width=(image.width*iheight)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
ImgD.alt="图片尺寸："+image.width+"×"+image.height;
}
}
}
//调用范例：<img src="图片" ="java:DrawImage(this, 200, 200)">
</>
</head>
<body>
<div class="box">
<img alt="牛群恩师练维约老师：他是班里的团支部书记" src="http://www.cnbanbao.cn/a/UploadPic/2010-6/201062716598623.jpg" ="java:DrawImage(this, 157, 157); imgCenter(this)" ="zoom(this, this.src)" style="cursor:pointer;"/>
</div>
</body>
</html>
上面的代码在使用过程中值得注意的是：img标签的上级目录必须为div，为其他任何标签均不能使用。
这只是针对部分需要居中的图片，如果是全站图片默认居中，通过css一下就可以搞定了。在css文件上加这么一段就可以了。
img {
vertical-align: middle;
} | 
浪子king 
