Content

• To step
• Tips

This wikiHow explains how to set the height and width of an image using HTML (HyperText Markup Language).

• The "width" indicates the width of an image in pixels.
• The "height" indicates the height of an image in pixels.
• In HTML 4.01, the height can be defined in pixels or percentages. In HTML5, the value must be in pixels.

To step

1. Edit the file for which you want to show the image. for example: default.html
2. Add this line to your script
   • img src = "imagefile.webp" alt = "Image" height = "42" width = "42">
   • src is the file path to your image.
   • alt is the label that you give your image.
3. Replace "height" and "width" as you like, for example height = "19" width = "20"
4. Save the file and open the file with any browser to see the effect. The "width" attribute is supported in all major browsers such as Google Chrome, Safari, Mozilla Firefox, Opera, Internet Explorer etc.

Tips

• Always specify the height and width attributes for images. If the height and width are set, the space required for the image will be reserved when the page loads. However, without these attributes, the browser does not know the size of the image and no suitable space can be reserved for it. The effect of this is that the page layout changes during loading (while the images are loading).
• Reducing the size of a large image by adjusting its height and width forces a user to download the large image (even if it looks small on the page). To avoid this, you need to rescale the image with a program before placing it on a page.