Resize image in html keep aspect ratio

Updated: 05/02/2021 by Computer Hope

The steps below guide users wanting to keep an image at its original file size (in KB or MB) and change the display size of the image with HTML (HyperText Markup Language).

Although this is possible, we still suggest you resize an image using an image editor to reduce the file size and reduce the download time of the image.

When an image's size is changed using the steps below, it still has to load the larger image, even though it appears smaller in the browser.

Resize with HTML

Specify the width and height in your "img src" HTML tag as shown in the example below.

<img src="https://www.computerhope.com/cdn/computer-hope.png" width="200" height="40" alt="Computer Hope">

How the image appears normally

Using the code above to resize the image

Resize with CSS

Alternatively, resize an image through CSS (Cascading

how to resize image in html mdn

how to resize image in html background