HTML Menu

Image Tag in HTML

  • Images play an important role in webpages.The total look of a webpage is improved using images.
  • Images can be embedded inside html document using <img> tag. Minimum it requires a parameter i.e "src" ,which indicates source of image.
  • <img> tag is used to display image on the web page. <img> tag is an empty tag that contains attributes only, closing tags are not used in HTML image element.

    format :
    <img src="filename/path" [ border=n px ] [ alt="text" ] [ height=n ] [ width=n ] />
  • Sometimes we can use images as hyperlink.

    Example:
    <a href="a.html" ><img src="a.jpg"/></a>

Attributes of <img> tag :


The src and alt are important attributes of HTML img tag. All attributes of HTML image tag are given below.

  • src: It is a necessary attribute that describes the source or path of the image. It instructs the browser where to look for the image on the server. The location of image may be on the same directory or another server.
  • alt: The alt attribute defines an alternate text for the image, if it can't be displayed. The value of the alt attribute describes the image in words.
  • width: It is an optional attribute which is used to specify the width to display the image. It is not recommended now. You should apply CSS in place of width attribute.
  • height: It specifies the height of the image. The HTML height attribute also supports iframe, image and object elements. It is not recommended now. You should apply CSS in place of height attribute.
Example : "image.html"
<html>
<head>
<title>Image</title>
</head>
<body>
<img src="html.png" alt="HTML" width="200px" height="150px">
<br/><br/>
<img src="taj.jpg" alt="JAVA" border=2>
</body>
</html>

Output:
image

Next Topic :Forms in HTML