Example
Note: The width and height attributes are not deprecated on images and never have been. Their use has been made much stricter though.
The dimensions of an image can be specified using the width and height attributes of the image tag:
<img src="images/200x200-img.png" width="200" height="200" alt="A 200x200 image">
By specifying the width and height of an image, your structure gives the browser a hint as to how the page should be laid out even if you are just specifying the actual image size. If the image dimensions are not specified, the browser will need to recalculate the layout of the page after the image is loaded, which may cause the page to "jump around" while it's loading.
4.1
You can give the image a width and height in either the number of CSS pixels or a percentage of the image's actual dimensions.
These examples are all valid:
<img src="images/50x50-img.png" width="50" height="50" alt="A 50x50 image">
<img src="images/50x50-img.png" width="200" height="200" alt="A 200x200 image">
<img src="images/200x200-img.png" width="50" height="50" alt="A 50x50 image">
<img src="images/200x200-img.png" width="50%" height="50%" alt="A 100x100 image">
5
The width and height of the image must be specified in CSS pixels; a percentage value is no longer a valid value. As well, if both attributes are specified, they must fit into one of three formulas that maintain aspect ratio. Although valid, you should not use the width and height attributes to stretch an image to a larger size.
These examples are valid:
<img src="images/50x50-img.png" width="50" height="50" alt="A 50x50 image">
<img src="images/200x200-img.png" width="50" height="50" alt="A 50x50 image">
<img src="images/50x50-img.png" width="0" height="0" alt="A hidden tracking image">
This example is not recommended:
<img src="images/50x50-img.png" width="200" height="200" alt="A 200x200 image">
These examples are invalid:
<img src="images/200x200-img.png" width="50%" height="50%" alt="A 100x100 image">
<img src="images/200x200-img.png" width="1" height="200" alt="A 1x200 image">
