CSS automatic control of picture size code

CSS prevents image size from being too large

Add the following CSS:

The code is as follows
IMG { max-width:800px; Height:auto; }

The max-width:800px in code limits the maximum width of the picture to 800 pixels, and the following hight:auto is critical to ensure that the picture has the correct aspect ratio and is not distorted by the width of the adjustment.

Practical examples

WordPress Automatically resize pictures

1, open your style sheet (style.css) file, and then add the following code in P img{or similar places (you can change all 550 to the width you want)

The code is as follows
P img{ max-width:550px; Width:expression (This.width > 550?) "550px": true); Height:auto; }

2, empty the cache is OK!

3, the same for some older versions of IE do not support.

If you want to work part-time all browser JQ or JS is the best way

code is as follows

&nbs P;

//  method:setselectreadonly  is used to set the polar select control readonly, //This one analog read-only is not true read-only   ///Use Onbeforeactivate,onfocus,onmouseover,onmouseout event   //Sample:< img src= ' Img.jpg ' onload= ' imgautosize (imgd,fitwidth,fitheight) ' >   //  create by sl   //------ ---------------------------------------------  Function imgautosize (imgd,fitwidth,fitheight)   &NBSP {  var image1=new Image ();    Image1.onload = function ()   {  if (this . width>0 && this.height>0)    {   if (this.width/this.height>= FitWidth/ Fitheight)    {   if (this.width>fitwidth)    {   IMGD.WIDTH=FITWIDTH;&NBSP;&NBSP Imgd.height= (this.height*fiTwidth)/this.width;   }   else   {   Imgd.width=this.width ;    imgd.height=this.height;   }   }   else   {   if (this.height>fitheight)    {   imgd.height=fitheight;  &NBSP Imgd.width= (this.width*fitheight)/this.height;   }   else   { &NBSP;&NBSP imgd.width=this.width;   imgd.height=this.height;   }   }   }  Image1 = null;  } image1.src=imgd.src;   ImgD.style.cursor = ' hand ';   imgd.onclick= function () {Openwin (this.src, ' Imgphoto ', 600,400)};  Imgd.title = "Click to view the original image in a new window";   }