首页 / 脚本样式 / JavaScript / 使用CSS和Javascript控制网页图片宽度的大小

使用CSS和Javascript控制网页图片宽度的大小2010-04-09JorWangJorWang の 小喇叭：『 最近比較忙啊，暫時不更新了，大家玩得開心點哦！O（∩_∩）O~ 』

刚刚看到两个控制网页图片宽度的大小的方法，觉得很好很方便，特此分享给大家。

第一个方法是使用CSS来实现控制大小：

img{border:0;margin:0;padding:0;max-width:590px;width:expression（this.width>590？"590px":this.width）; max-height:590px;height:expression（this.height>590？"590px":this.height）;}

如果你要兼容IE6的话，可以配合使用以前介绍的这个Javascript脚本。

第二个方法是使用Javascript来控制控制网页图片宽度的大小：

function set_img_size（obj, width）{if （！obj） return ;if （！width） {width = obj.clientWidth * 0.9;if （width < 400） return; /*设置图片的限定宽度*/}img_items = obj.getElementsByTagName（"img"）if （img_items）{for （i=0; i<img_items.length; i++） {var s_width = img_items[i].width;var s_height = img_items[i].height;if （s_width > width） {img_items[i].style.width = width + "px";if （s_height == img_items[i].height） {img_items[i].style.height = （（width / s_width） * img_items[i].height） + "px";}img_items[i].onclick = function（） {window.open（this.src）};img_items[i].style.cursor = "pointer";img_items[i].alt = "点击查看原始尺寸";}}}} function selfadaptation_size（） {if （typeof（content_img_width） == "undefined"）set_img_size（document.getElementById（"posts"））; /*控制图片所在的元素ID号*/elseset_img_size（document.getElementById（"posts"）, content_img_width）; /*控制图片所在的元素ID号*/ set_img_size（document.getElementById（"custom"））; /*控制图片所在的元素ID号*/} if （window.addEventListener）window.addEventListener（"load", selfadaptation_size, false）;else if （window.attachEvent）window.attachEvent（"onload", selfadaptation_size）;elsewindow.onload = selfadaptation_size;

如果你有更好更简洁的方法，分享给我吧，谢谢了！