HTML Images

To show images in your HTML pages, you can use <img> tag. You can use .jpg, .gif, .png images in you web page. Always use compress image like jpg, gif and png images for faster loading and better results.

Img tag and it's Attributes:

Src: This is used to define the path of the image file that you want to show in your web page.

<img src="path2yourfile.gif">

Align: You can set alignment of the image like left, right or center.

 <img src="path2yourfile.gif" align="left"> 

Alt: Alternate text. For any case if the image can't display in the web browser the alt text will disply in place of the image. This is also required for SEO (Search Engine Optimization).

 <img src="path2yourfile.gif" alt="this is my image"> 

Border: This element used to define the border of the image. You can use border="0" (Zero) to display no border.

 <img src="path2yourfile.gif" border="0"> 

Class: You can also assign CSS class to any image with the help of class attribute.

 <img src="path2yourfile.gif" class="myClass"> 

Height: This attribute is used to define the height of an image.

 <img src="path2yourfile.gif" height="50px"> 

Id: You can set any unique id of an image for programming use with the help of ID attribute.

 <img src="path2yourfile.gif" id="uid3"> 

Width: This attribute is used to define the width of an image.

 <img src="path2yourfile.gif" width="100px"> 

Title: This attribute is used to define the Title of an image. On mouse over the image the title of the image will display. This is an optional option, but it is also helpfull for SEO.

 <img src="path2yourfile.gif" title="Image title here"> 

Hyperlink of an image

<a href="mypage.html"><img src="file.gif" border="0"></a>