The <img> tag is the image tag in HTML. It inserts images in web pages. It is a single tag, i.e., it has no closing tag.

Images are a necessary part of writing rich content on the internet. They help in easy reading. They are the face of content on internet, especially on social media.

You can add thumbnail images for social media using meta tags, which we will discuss in meta tag tutorial. Today we will discuss about inserting images within the body of a web page.

The <img> tag has a specified syntax with different attributes to control image behaviour. Look at the syntax below:

Syntax

<img src=”location of image” alt=”info. about image” height=”px” width=”px”>

Example:

<img src=”images/flower.jpg” alt=”Image of marigold” height=”50px” width=”60px”>


Example of img tag

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title> HTML Image Tag </title>
</head>
<body>
<img src=”HTML-Image.png” width=”400px” height=”200px”>
</body>
</html>

Output





Image Tag Attribute

AttributesValuesDescription
src“image source url path”Required, Image path should be absolute path.
width“size_px”Specifies the Width to display the image.
Height“size_px”Specifies the Height to display the image.
Align“left”
“right”
Specifies the image align side.
Border“Size”
eg. “0”
Specifies the image border size.
alt“alternate text”Required Attribute. Specifies text to be identify the image.

Leave a Comment

Your email address will not be published.