The img
tag, or Image Embed element, embeds an image in an HTML document.
There are two attributes that are required for the <img>
tag: src
, which provides the URL of the image, and alt
, which provides an alternate text for the image. Alt text is displayed if the image cannot be displayed for some reason. It is also read by screen readers and machines for SEO purposes.
<img src="path-to-image.jpg" alt="aletrnate description of the image" width="600" height="400">
alt
Provides alternate, descriptive text for the image.
crossorigin
Allows images that are embedded from third-party sites to be used with canvas. Values: anonymous
or use-credentials
.
height
Provides the height of the image in pixels.
ismap
Designates that the image is a server-side image map.
loading
Utilizing the values eager
or lazy
, the loading
attribute determines if the browser should load the <img>
immediately or after certain conditions are met.
longdesc
Provides the URL that has a detailed description of the image.
referrerpolicy
Determines which referrer information is sent when fetching the <img>
. Possible values: no-referrer
, no-referrer-when-downgrade
, origin
, origin-when-cross-origin
, and unsafe-url
.
sizes
Provides image sizes for different page layouts.
src
Provides the URL for the image.
srcset
Provides a list of image files which will be used in different situations, such as different browser sizes.
usemap
Designates that the image is a client-side image map.
width
Provides the width of the image in pixels.
Have a code example of <img>
? Submit a codepen.io demo and we'll showcase it here ↴