CSS Force picture size

I believe that when you do the Web page will often encounter large-resolution images will break the table so that beautiful pages beyond recognition, but as long as the use of the following CSS statements can be resolved.

The function of the CSS is: images greater than 600 are automatically adjusted to 600 display.

<style type= "Text/css" >
<!--

img {width:expression (this.width>600? ") 600px ": this.width+" px ");}
}

-
</style>

The above code in the process of use found that the first time the page opened the picture will be reduced to a very small, need to refresh the page to reach the size set, and found the following code:

img{
max-height:720px;
max-width:640px;
Width:expression (This.width > 640 && this.height < this.width? 640:true);
Height:expression (This.height > 720 720:true);
}

The test can solve the problem of adaptive size of the image.

Another way is to make the picture adaptive to the size of the div and table:
Define a Java function first

<script type= "Text/javascript" >

function Reimgsize () {
for (j=0;j<document.images.length;j++)
{
Document.images[j].width= (document.images[j].width>420)? " 420 ":d ocument.images[j].width;
}
}

</script>

Then add onload= "reimgsize ()" to the body area.

Incidentally:

Mozilla supports a max-width CSS syntax. So we define the global style of the picture in this way.

img{
Max-width:100%;height:auto;
}
This way the picture is automatically adapted to its size within the DIV or table.