HTML img tag

HTML Tag❮ PreviousComplete HTML ReferenceNext ❯Example

How to insert an image:

Try it Yourself »

More "Try it Yourself" examples below.

Definition and Usage

The tag is used to embed an image in an HTML page.

Images are not technically inserted into a web page; images are linked to web pages. The tag creates a holding space for the referenced image.

The tag has two required attributes:

src - Specifies the path to the image alt - Specifies an alternate text for the image, if the image for somereason cannot be displayed

Note: Also, always specify the width and height of an image. If width and height are not specified, the page might flicker while the image loads.

Tip: To link an image to another document, simply nest the tag inside an tag (see example below).

Browser Support ElementYesYesYesYesYesAttributesAttributeValueDescriptionalttextSpecifies an alternate text for an imagecrossoriginanonymoususe-credentialsAllow images from third-party sites that allow cross-origin access to be used with canvasheightpixelsSpecifies the height of an imageismapismapSpecifies an image as a server-side image maploadingeagerlazySpecifies whether a browser should load an image immediately or to defer loading of images until some conditions are metlongdescURLSpecifies a URL to a detailed description of an imagereferrerpolicyno-referrerno-referrer-when-downgradeoriginorigin-when-cross-originunsafe-urlSpecifies which referrer information to use when fetching an imagesizessizesSpecifies image sizes for different page layoutssrcURLSpecifies the path to the imagesrcsetURL-list Specifies a list of image files to use in different situationsusemap#mapnameSpecifies an image as a client-side image mapwidthpixelsSpecifies the width of an imageGlobal Attributes

The tag also supports the Global Attributes in HTML.

Event Attributes

The tag also supports the Event Attributes in HTML.

More ExamplesExample

Align image (with CSS):

Try it Yourself »Example

Add image border (with CSS):

Try it Yourself »Example

Add left and right margins to image (with CSS):

Try it Yourself »Example

Add top and bottom margins to image (with CSS):

Try it Yourself »Example

How to insert images from another folder or from another web site:

Try it Yourself »Example

How to add a hyperlink to an image:

Try it Yourself »Example

How to create an image map, with clickable regions. Each region is a hyperlink:

     

Try it Yourself »Related Pages

HTML tutorial: HTML Images

HTML DOM reference: Image Object

CSS Tutorial: Styling Images

Default CSS Settings

Most browsers will display the element with the following default values:

Exampleimg {   display: inline-block;} Try it Yourself »

❮ PreviousComplete HTML ReferenceNext ❯★ +1  W3schools PathfinderTrack your progress - it's free! Log in Sign Up