View video tutorial

HTML Images

HTML

HTML <img> tag is used to display images on the web page.

Image tag <img/>


<img/> is and empty tag and does not have closing tag. It contains attributes only.

alt attribute is used to show alternate text when image can not be displayed.

width and height attributes are to set the width and height of the picture.

Learning with HTML Editor "Try it Now"

You can edit the HTML code and view the result using online editor.

Image for a bird

parrot parrot

Image for a bird: using width and height attributes: width="400px" height="600px"

parrot

Image for a bird: using style attribute: style="width: 300px; height: 200px;"

Example

<!DOCTYPE html>
<html>

<head>
   <title>HTML Img - HTML Images</title>
   <meta charset="utf-8" />
</head>

<body>

   <h3>Image for a bird</h3>
   <img src="parrot.png"  alt="parrot">
   <p>Image for a bird: using width and height attributes</p>
   <img src="parrot.png" width="400px" height="600px"  alt="parrot">
   <p>Image for a bird: using width and height attributes</p>
   <img src="parrot.png" style="width: 300px; height: 200px;"  alt="parrot">

</body>

</html>

Output is:

parrot

Click on the "Try Now" button to see how it works.