Pr.Pg Next Pg

<IMG> tag tutorials Working with IMAGE & GRAPHICS

  • This is a singular tag. It doesn’t require closing tag.

  • A Good Picture is worth 1000 Words

  • Graphics, images, pictures, photograph, Animation and all visual elements enhance the Web page.

  • Its easiest way to give unique look to page and it also offers appealing communication. <IMG> tag is used to incorporate graphic images in the body of document.

  • Following table shows the attributes of <IMG> tag:

 

Sr No

Attributes

Descriptions

1

SRC

This attribute of <IMG> tag element helps to specify location of graphic image file. Graphic Files like .GIF, .JPG or .JPEG , PNG are widely supported and can easily be displayed on the Internet.

2

ALT

This attribute of <IMG> tag element is similar to Tool tip. Browser display floating message when visitor moves mouse pointer over an image.

3

BORDER

This attribute of <IMG> tag element sets border around an image. By default border is set to 0 (No border). When you specify border = number of pixels, it draws border around an image as specified by Pixels. The border color will be same as of color of normal text.

4

HEIGHT

This attribute of <IMG> tag element is used to specify Vertical Height of an image in pixels. If you specify only Height attribute, it automatically adjust Width in proportion

5

WIDTH

This attribute of <IMG> tag element is used to specify Horizontal Width of an image in pixels. If you specify only Width attribute, it automatically adjust Height in proportion.

6

ALIGN

These attributes of <IMG> tag element align the text following the image. It helps to specify the appearance of text that in near an inline graphic image.

ALIGN = TOP: Indicates the text after the image to be written at the top, next to the image.

ALIGN = MIDDELE: Indicates the text after the image to be written at the middle, next to the image.

ALIGN = BOTTOM: Indicates the text after the image to be written at the bottom, next to the image.

ALIGN = LEFT: Display the image on left side of the screen.

ALIGN = CENTER: Display the image in center of the screen.

ALIGN = RIGHT: Display the image on Right side of the screen.

 

Syntax:

<body>

<img src=”url” >

</body>

 

Example: HTML program to demonstrate IMG tag

Output:
Pr.Pg border                                              Next Pg