How to Change Image Size in Html

In HTML, we can change the size of any image using the following different ways:

1. Using HTML tag
2. Using an Inline style attribute
3. Using internal CSS

Using HTML tag

Note: HTML 5 does not support the height and width attribute of , so we have to use the inline style attribute and internal CSS options for changing the image or picture size.

If we want to change the size of an image in the document using Html tag which is to be displayed on a web page, we have to follow the steps which are given below. Using these steps, we can easily change the image size:

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to change the size of an image.

Step 2: Now, place the cursor inside the img tag. And then, we have to use the height and width attribute of the img tag for changing the size of an image. So, we have to type these attributes:

Step 3: And, at last we have to save the Html file and then run it.

The output of the above Html code is shown in the following screenshot:

Using an Inline Style attribute

If we want to change the size of an image using an inline style attribute which is to be displayed on a web page, we have to follow the steps which are given below. Using these steps, we can easily change the picture size.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the style attribute for changing the size of an image.

Step 2: Now, place the cursor inside the img tag of that image whose size we want to change. And then, we have to type the style attribute just after the src attribute. And then, we have to type the width and height property in the style attribute same as shown in the following block:

Step 3: And at last we have to save the Html file and then run it.

The output of above Html code is shown in the following screenshot:

Using Internal CSS

If we want to change the size of an image or picture using an internal cascading stylesheet which is to be displayed on a web page, we have to follow the steps which are given below. Using these steps, we can easily change the size of any image.

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the internal CSS for changing the size of an image.

Step 2: Now, we have to place the cursor in the head tag of the Html document and then define the styles inside the