HTML Images


  • Images are defined with the <img> tag in HTML.
  • <img> tag contains only attributes.
  • <img> tag does not have closing tag.


  • alt attribute displays an alternate text for an image
  • If an image is not display, then alt attribute will display the value.


Program 1
<img src=”basicofy.png” alt=””>

Width & Height

  •  For specifying the width and height of an image we use the style attribute.
Program 2
<img src=”basicofy.png” alt=””width=”150″ height=”150″>

Images in Another Folder:

  • It is common to store images in a one folder.
  • You must then include the folder name in the src attribute.
Program 3
<img src=”09/basicofy2.png” alt=”” width=”150″ height=”150″ />

Image Floating

Program 5

<!DOCTYPE html>

<p><strong>Float the image at right:</strong></p>
<img src=”flower.jpeg” alt=”Smiley face” style=”float:right;width:42px;height:42px;”>
The floating image at RIGHT side.

<p><strong>Float the image at left:</strong></p>
<img src=”flower.jpeg” alt=”Smiley face” style=”float:left;width:42px;height:42px;”>
The floating image at LEFT side. </p>



Float the image at right:

Smiley face The floating image at RIGHT side.

Float the image at left:

Smiley face The floating image at LEFT side.


Leave a Reply

Your email address will not be published. Required fields are marked *