HTML <img> tag
Definition and Usage
The img element defines an image.
Differences Between HTML and XHTML
In HTML the <img> tag has no end tag.
In XHTML the <img> tag must be properly closed.
The "align", "border", "hspace", and "vspace" attributes of the image element
were deprecated in HTML 4.01.
The "align", "border", "hspace", and "vspace" attributes of the image element
are not supported in XHTML 1.0 Strict DTD.
Browser Support
The tag is supported in all major browsers.
If you use the alt attribute in in most browsers (except Internet Explorer) on images and image maps the text
will not show on mouse-over.
The alt is meant to be used as an
alternative text if the image doesn't load, not as a mouse-over text.
For full support for mouse-over comments on images or image maps, use the
title attribute in the <img> tag.
Example: <img src="image.gif" alt="bla" title="bla bla bla"
/>
Example
| Source |
Output |
| <img src="angry.gif"
alt="Angry" /> |
|
Required Attributes
DTD indicates in which DTD the attribute is
allowed. S=Strict, T=Transitional, and F=Frameset.
| Attribute |
Value |
Description |
DTD |
| alt |
text |
Defines a short description of the image |
STF |
| src |
URL |
The URL of the image to display |
STF |
Optional Attributes
| Attribute |
Value |
Description |
DTD |
| align |
top
bottom
middle
left
right |
Deprecated. Use styles instead.
Specifies how to align the image according to surrounding text. |
TF |
| border |
pixels |
Deprecated. Use styles instead.
Defines a border around an image. |
TF |
| height |
pixels
% |
Defines the height of an image |
STF |
| hspace |
pixels |
Deprecated. Use styles instead.
Defines white space on the left and right side of the image. |
TF |
| ismap |
URL |
Defines the image as a server-side image map |
STF |
| longdesc |
URL |
A URL to a document that contains a long description of the
image |
STF |
| usemap |
URL |
Defines the image as a client-side image map. Look at the
<map> and <area> tags to figure out how it works |
STF |
| vspace |
pixels |
Defines white space on the top and bottom of the image.
Deprecated. Use styles instead |
TF |
| width |
pixels
% |
Sets the width of an image |
STF |
Standard Attributes
| id, class, title, style, lang, xml:lang |
For a full description, go to Standard
Attributes.
Event Attributes
| onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup |
For a full description, go to Event
Attributes.
Try-It-Yourself Demos
Insert images
How to display images in your Web page.
Insert
images from different locations
How to display images from another folder or another server in your Web page.
Aligning
images
How to align an image within the text.
Let the
image float
How to let an image float to the left or right of a paragraph.
Adjust an
image to different sizes
How to adjust an image to different sizes.
Make a hyperlink of an
image
How to use an image as a link.
Create an image map
How to create an image map, with clickable regions.
Each region is a hyperlink.
|
HOME
Printer friendly page
