HTML Images

To show the images on webpage HTML img tag is used, img tag is empty tag that contains the attributes only.

Closing tag is not used in HTML image element.

<img src="positive_quotes.jpg" alt="Positive Quotes"/>

This example will show the hello_good_morning.jpg image on webpage.

Attributes of HTML img Tag:

1] src:

src attribute specifies the source(path) of the image. You need to specify the image name and image extension in src tag. suppose your image name is positive_quotes.jpg you need to specify it like.

<img src="positive_quotes.jpg"/>

How to get image from another directory/folder

To insert an image on your webpage from another folder or from another drive, you need to specify the full path.

suppose you want to insert image which are stored in d: drive inside image folder and image name is quote.png

you need to specify full path like this

<img src="d:\images\quote.png" alt="quotes"/>

2] alt:

alt attribute is used to display an alternative text in case if image cannot be displayed on browser.

alt attribute is important for seo purpose also. When you not specify the alt attribute google cannot find your images.

<img src="positive_quotes.jpg" alt="Positive Quotes"/>

3] width:

Width attribute is used to display the image width

4] height:

Height attribute is used to display the image height.

Image Height Width Example:

<img src="positive_quotes.jpg" alt="Positive Quotes" height="400" width="400"/>

Above example show 400*400 image dimensions.