-HTML IMAGE TAG-

HTML image tag makes our webpages more attractive and descriptive. It is always better to use images in place of writing lot of texts. In HTML, Images can be used as a background attribute in <BODY> tag.

HTML image tag

 It can be used as:-

<BODY BACKGROUND="URL">
 Now Image given as in URL will appear as background and all work will be displayed over background.

But if you want to display an image or more than one image, but not as background, for this we use <IMG> tag.

<IMG > tag is used to corporate/embed an image to the webpage. It can use many attribute, but necessary attributte in SRC. It is used as :-

<IMG SRC="URL">
Where, "URL" specifies the actual address of the image which you want to embed in webpage.

For example--- 
                       <BODY>
                       <IMG SRC="C"/LION.JPG">
                         Image of lion
                         </BODY>

<IMG> is an empty tag, it has no closing tag </IMG>

<IMG> tag can have following attributes---


  • ALIGN---After an image is inserted in webpage, you can determine how image should be placed in relation to other content of the webpage. By default, an image is placed by the broser where it is parsed and any text following the image will appear to the right bottom edge of the image.However, you can change the alignment of image by using ALIGN attribute.
It is used as---
                       <IMG SRC="LION.JPG" ALIGN="VALUE">

The possible value are----

I. TOP-Align the top of image with the top of the tallest element of the same line.
HTML image tag


II. MIDDLE- Align the middle of the image with the middle of surrounding text.
HTML image tag


III. BOTTOM-Align the bottom of image of surrounding text.
HTML image tag


IV. LEFT- Places an image on the left side of the browser with text wrapped around the left side of image.
HTML image tag


V. RIGHT-Places an image on the right side of browser window with text wrapped around the right side of image.                             
  • ALT-This attribute is used to give short descriptions about the image. It is always to give some alternative text to an image so that visitor can get an idea about the image before it is loaded.
For example-
                    <IMG SRC=LION.JPG" ALT="IMAGE OF LION>
  • WIDTH and HEIGHT- These attribute are used to specify the width and height of an image. 
For example- 
                    <IMG SRC="LION.JPG WIDTH="400" HEIGHT="300">

Now image will appear 400 pixels wide and height 300 pixels.
  • HSPACE and VSPACE-These attributes are used to set the horizontal and vertical space around an image.
for example- <IMG SRC="LION.JPG" HSPACE=10 VSPACE=10>
  • BORDER-This attribute is used to create a frame/border around an image.
For example-
                     <IMG SRC="LION.JPG BORDER=5>

------------------------------------------------- for example----------------------------------------------

                                                                 HTML CODE                                                     

            HTML image tagWHEN RUNNING IN A BROWSER

HTML image tag