HTML - Image

Images are very important to look beautify as well as to depict many complex concepts in simple way on your web page. This tutorial will take you through simple steps to use images in your web pages.

HTML img tag is used to display image on the web page. HTML img tag is an empty tag that contains attributes only, closing tags are not used in HTML image element.

Example :-

This is an example, where we are adding HTML, Meta Tags, Metadata as important keywords about the document.

Result :-

Simple Image Insert

Set Image Height / Width

You can set image width and height based on your requirement using width and height attributes. You can specify width and height of the image in terms of either pixels or percentage of its actual size.

Example :-

Result :-

Set Height and width of a image

Attribute of HTML img Tag

The src and alt are important attributes of HTML img tag. All attributes of HTML image tag are given below.

src :-

It is a necessary attribute that describes the source or path of the image. It instructs the browser where to look for the image on the server.The location of image may be on the same directory or another server.

alt :-

The alt attribute defines an alternate text for the image, if it can't be displayed. The value of the alt attribute describe the image in words. The alt attribute is considered good for SEO prospective.

height :-

It specifies the height of the image. The HTML height attribute also supports iframe, image and object elements. It is not recommended now. You should apply CSS in place of height attribute.

width :-

It is an optional attribute which is used to specify the width to display the image. It is not recommended now. You should apply CSS in place of width attribute.