Do not know home has not encountered such a situation: in the CSS control picture size, if the width of the picture is written dead, such as img{width:500px;}, of course, if the picture width is greater than 500px can be very good control it does not let it too large, but if the picture width is less than 500px, For example, only 100px, the previous wording will enlarge this picture 5 times times to show, obviously, this is not what we want to see.
So how can css differentiate between the size of these picture settings? Very simple, please see:
Copy Code code as follows:
Img{width:expression (this.width>500?) 500px ": this.width+" px "); }
As long as the use of this code in CSS, you can control large pictures and small pictures. It means that if the picture width is greater than 500px, then the picture is displayed in 500px size, if less than, then the picture is displayed according to the original size! What, is it really simple?
Disadvantages: Increase the load on the client, generally with JS to achieve more.
