网页中控制图片大小
在网页中，有时候所引用的图片过大，导致显示的时候只能显示一部分。对此，应当对图片进行一定的缩放，具体方法如下：
1.利用css对图片大小进行控制：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>test</title><style type="text/css">img{ border:0; margin:0; padding:0; max-width:1280px; width:expression(this.width>1280?"1280px":this.width); max-height:720px; height:expression(this.height>720?"720px":this.height); }</style></head><body ><div><img src="test.jpg"/></div></body></html>或者，还可以这样使用：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>test</title></head><body><div style="width:200px; height:100px;"><img src="test.jpg" width="100%" height="100%"/></div></body></html>
这两种方式均是按照图片原来的大小进行一定比例的缩放。
2.利用js实现：
<body><div id=article><img height="800" width="1280" src="test.jpg" /></div><script type="text/javascript" >//缩放图片到合适大小function ResizeImages(){ var myimg,oldwidth,oldheight; var maxwidth=1280; var maxheight=720; var imgs = document.getElementById('article').getElementsByTagName('img'); //如果你定义的id不是article，请修改此处 for(i=0;i<imgs.length;i++){ myimg = imgs[i]; if(myimg.width > myimg.height) { if(myimg.width > maxwidth) { oldwidth = myimg.width; myimg.height = myimg.height * (maxwidth/oldwidth); myimg.width = maxwidth; } }else{ if(myimg.height > maxheight) { oldheight = myimg.height; myimg.width = myimg.width * (maxheight/oldheight); myimg.height = maxheight; } } }}//缩放图片到合适大小ResizeImages();</script></body>这种方式可以任意设置图片的宽高。
参考：
1.http://www.cnblogs.com/liukai/archive/2009/12/29/1635397.html
2.http://www.lanrentuku.com/js/picture-634.html