HTML IMAGE AND IMAGE MAP TAGS

 

 

Image tags are used to place / embed an image in a web page. An image–map is an image with clickable (hyperlinked) areas.

 

TAG	FUNCTION
<IMG> (standalone tag) Attributes - 14	Embeds an image in an HTML page.
<MAP> (container tag) Attributes-1	Defines a client–side image–map. The <map> element contains a number of <area> elements, that defines the clickable areas in the image map.
<AREA> (standalone tag) Attributes - 11	The <area> tag defines an area inside an image-map. It is always nested inside a <map> tag.

 

Tag: <IMG>

Attribute	Description and values
ALIGN	Specifies the alignment of an image according to surrounding elements (VALUE: top, bottom, middle, left, right)
ALT	Specifies an alternate text for an image. (VALUE: text)
BORDER	Specifies the width of the border around an image.
CROSSORIGIN	Allow images from third-party sites that allow cross-origin access to be used with canvas
HEIGHT	Specifies the height of an image
WIDTH	Specifies the width of an image
HSPACE	Specifies the whitespace on left and right side of an image
ISMAP	Specifies an image as a server-side image-map
LONGDESC	Specifies a URL to a detailed description of an image
SIZES	Specifies image sizes for different page layouts
SRC	Required attribute. Specifies the URL of an image
SRCSET	Specifies the URL of the image to use in different situations
USEMAP	Specifies an image as a client-side image-map
VSPACE	Specifies the whitespace on top and bottom of an image

 

Tag: <MAP>

Attribute	Description and values
NAME	Required attribute. Specifies the name of an image-map. (VALUE : user specified mapname)

 

Tag: <AREA>

Attribute	Description and values
ALT	Specifies an alternate text for the area. Required if the href attribute is present
DOWNLOAD	Specifies that the target will be downloaded when a user clicks on the hyperlink
COORDS	Specifies the coordinates of the area
HREF	Specifies the hyperlink target for the area
HREFLANG	Specifies the language of the target URL
MEDIA	Specifies what media/device the target URL is optimized for
NOHREF	Specifies that an area has no associated link
REL	Specifies the relationship between the current document and the target URL
SHAPE	Specifies the shape of the area (VALUES: default, rect, circle, poly)
TYPE	Specifies the media type of the target URL
TARGET	Specifies where to open the target URL. (VALUE: _blank, _parent, _self, _top, framename)