Image - <img> tag
The <img> tag is used to place an image on the web page.
This tag does not contain closing tag.
src is one of the attribute, it is mandatory and is used to specify the image path.
<img src="image_url">
width and height attribute in <img> tag
These attribute are used to change the size of the images, it is not mandatory to specify. But it is highly recommended to use.
It doesn't change the images original size, but changes the size only when displaying on the web page.
No stretched image
If you set anyone of the width or height attribute value, the image will not stretch.
alt Attribute in <img> tag
alt(alternative) attribute is used to show a tooltip if the path of the image or image name given is incorrect.
Search engines, search and retrieves the image by the alt attribute value.
In the following example, you can see a tooltip text while you place mouse pointer over the image.
When an image path is incorrect, instead of the image the alt attribute value will be displayed.
In the following example, wrong image path is given, so instead of the original image an broken image icon is displayed along with the alternate text (This is the butterfly image).
HTML image link
We can create a image link using <a> tag and <img> tag
Already we have seen about the <a> tag in previous chapter.
You can just write the <img> tag inside the <a> tag.
<img> element inside <figcaption> tag
The <figcaption> tag is used to specify a title or caption for a image.
The <figcaption> tag is written inside the <figure> tag.