HTML <img> Tag
To embed an image in an HTML page, use the <img>
element.
Images are linked to web pages rather than being put into them. The <img>
element produces a placeholder for the specified image.
Two attributes are required for the image :
- tag: src - Specifies the image's path.
- alt: Specifies an alternate text for the picture if it cannot be shown for whatever reason.
Also, always mention the image's width and height. The website may flicker while the picture loads if the width and height are not provided.
Syntax
Attributes
Attribute | Value | Description |
---|---|---|
alt | text | Provides different text for a picture. |
crossorigin |
anonymous
use-credentials |
Allow the usage of pictures from third-party sites that allow cross-origin access with canvas. |
height | pixels | Specifies the height of an image |
ismap | ismap | Specifies an image's height. Specifies an image as a server-side image map. |
loading |
eager
lazy |
Specifies whether a browser should load an image immediately or postpone image loading until certain circumstances are satisfied. |
longdesc | URL | Specifies a collection of image files to be utilized in specific contexts. |
referrerpolicy |
no-referrer
no-referrer-when-downgrade origin origin-when-cross-origin unsafe-url |
Specifies which referrer information should be used to get an image. |
sizes | sizes | Specifies picture sizes for various page layouts. |
src | URL | Specifies the image's path. |
srcset | URL-list | Specifies a set of picture files to be used in certain scenarios. |
usemap | mapname | Specifies a picture to be used as a client-side image map. |
width | pixels | Specifies the width of an image |
Supported Browsers
Element | Chrome | Firefox | Safari | Edge / IE | Opera |
---|---|---|---|---|---|
<img> | Yes | Yes | Yes | Yes | Yes |