您的位置:首页 > Web前端 > CSS

解决图片太大溢出问题、CSS 限制图片最大宽度、图片按比例自动缩放

2015-01-01 16:31 716 查看
在网上找了很久,这里保存一下,方便以后使用

 

实现思路很简单,改造js代码,既然图片很大,那么我们先用最经典的限制width的方法限制大图的宽度,但是小图怎么办?小图我们用onload的方法再缩小,就这么搞定了。完美代码如下:

对应的JS代码:

<script language="JavaScript">

<!--

var flag=false;

function DrawImage(ImgD){

var image=new Image();

image.src=ImgD.src;

   if(image.width>0 && image.height>0){

   flag=true;

   if(image.width>650){

   }else{

   ImgD.width=image.width;

   ImgD.height=image.height;

   }

   }

}

//-->

</script>

对应的HTML代码:

<img border=0 src="图片路径" onload="javascript:DrawImage(this);" width="650" />
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  css 图片