Example
How to insert an image:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
More "Try it Yourself" examples below.
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 | |||||
|---|---|---|---|---|---|
| <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
= 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 | anonymous 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 |
Global Attributes
The <img> tag also supports the Global Attributes in HTML.
Event Attributes
The <img> tag also supports the Event Attributes in HTML.
Try it Yourself - Examples
Insert images from different locations
How to insert images from another folder or from another web site.
How to insert images from another folder or from another web site.
Make a hyperlink of an image
How to add a hyperlink to an image.
How to add a hyperlink to an image.
Create an image map
How to create an image map, with clickable regions. Each region is a hyperlink.
How to create an image map, with clickable regions. Each region is a hyperlink.
Related Pages
HTML tutorial: HTML Images
HTML DOM reference: Image Object
CSS Tutorial: Styling Images
Default CSS Settings
Most browsers will display the <img> element with the following default values:
Example
img {
display: inline-block;}
Hello, Friends. See my blog and Share with your friends. All the posts are real .All these apps and games were checked by me. If there is any problem in downloading or installing comment the problem .
No comments:
Post a Comment