cssで画像の大きさを制御して、画像の変形に悩まないでください


cssで画像の大きさを制御して、画像の変形に悩まないでください
皆さんが画像のサイズをコントロールするのに悩んでいるのを見て、私はいくつかのコードがあります.
1.(いいですね.使っています)
img {max-width:630px;myimg:expression_r(οnlοad=function(){this.style.width=(this.offsetWidth > 630)?"630px":"auto"});}

最大幅を630 pxに設定630より大きいと画像幅を630に設定するとスケールが小さくなり画像が変形しません
2.
img,a img{
border:0;
margin:0;
padding:0;
max-width:590px;
width:e­xpression(this.width>590?"590px":this.width);
max-height:590px;
height:e­xpression(this.height>590?"590px":this.height);
}


 
3.
	div img {

	max-width:600px;

	width:600px;

	width:expression(document.body.clientWidth>600?”600px”:”auto”);

	overflow:hidden;

	}

max-width:600px; IE 7、FFなど他の非IEブラウザでの最大幅は600 pxである.ただし、IE 6では無効です.width:600px; すべてのブラウザで画像のサイズは600 pxです.画像サイズが600 pxより大きいと、自動的に600 pxに縮小します.IE 6で有効です.overflow:hidden; 超えた部分は非表示で、画像のサイズ制御に失敗したことによる押し出し変形を避けます.
4.
画像の高さと幅が一定値を超えないように設定するには、画像の高さや幅がこの値を超えたときに、画像をこのサイズに縮小する必要があります.
1,FirefoxやIE 7以上のような現代のブラウザでは,max-widthとmax-heightの2つのCSS属性をそのまま使用すればよい.2,IE 6.0および以下のバージョンについては、上記の2つのCSS属性は無視されます.以前はこのようなことを処理していましたが、Javascriptを借りて、画像にonloadイベントを加えることがよくありました.例:


  functionresizeImage(obj){
  obj.width=obj.width>50&&obj.width>obj.height?50:auto;
  obj.height=obj.height>50?50:auto;
  }