HTML <img> Tags

Example

How to insert an image :

 <img src="w3professors.png" alt="w3professors" height="42" width="42"> 
Execute Code

Definition and Usage

The <img> tag defines an image in an HTML page.

The <img> tag has two required attributes : src and alt.

Note : Images are not technically inserted into an HTML page, images are linked to HTML pages. The <img> tag creates a holding space for the referenced image.

Tip : To link an image to another document, simply nest the <img> tag inside <a> tags.


Browser Support

Element Chrome Internet Explorer Firefox Safari Opera
<img> Yes Yes Yes Yes Yes

Differences Between HTML 4.01 and HTML5

The following attributes: align, border, hspace, and vspace are not supported in HTML5.


Differences Between HTML and XHTML

In HTML the <img> tag has no end tag.

In XHTML the <img> tag must be properly closed.


Attributes

html5badge= New in HTML5.

Attribute Value Description
align top
bottom
middle
left
right
Not supported in HTML5.
Specifies the alignment of an image according to surrounding elements
alt text Specifies an alternate text for an image
border pixels Not supported in HTML5.
Specifies the width of the border around an image
crossorigin html5badgeanonymous
use-credentials
Allow images from third-party sites that allow cross-origin access to be used with canvas
height pixels Specifies the height of an image
hspace pixels Not supported in HTML5.
Specifies the whitespace on left and right side of an image
ismap ismap Specifies an image as a server-side image-map
longdesc URL Specifies a URL to a detailed description of an image
sizes   Specifies image sizes for different page layouts
src URL Specifies the URL of an image
srcset URL Specifies the URL of the image to use in different situations
usemap #mapname Specifies an image as a client-side image-map
vspace pixels Not supported in HTML5.
Specifies the whitespace on top and bottom of an image
width pixels Specifies the width of an image

Default CSS Settings

Most browsers will display the <img> element with the following default values :

img 
{
    display: inline-block;
}