HTML Anchor Tag Shape Attribute

The HTML Anchor Tag Shape attribute <shape> defines the shape of the link, within an image or object, which can be clicked.

In other words we can say that by using the HTML Anchor Tag Shape Attribute we define the shape of clickable area within an image or object.

HTML Anchor Tag Shape Attribute is always used with the HTML Anchor Tag Coords attribute to define the shape, size and even the placement of the link in the area.


HTML Anchor Tag Shape Attribute Syntax

<a shape=”default|rect|circle|poly”>

HTML Anchor Tag Shape Attribute Values

HTML Anchor Tag Shape Attribute Values Description
Default Specifies that the entire region within an image is clickable
Rect Specifies a rectangular clickable region within the image
Circle Specifies a circular clickable region within the image
Poly Specifies a polygonal clickable region within the image

HTML Anchor Tag Shape Attribute Example

HTML Area Shape attribute Code Output
[sourcecode language=”html”]
<p>Click on the shapes to watch them:</p>
<img src=" HTMLAreaTagEx.gif" alt="Shapes"
usemap="#shapemap" width="145" height="126">
<map name="shapemap">
<a shape="circle" coords="25,30,12"  href="Circle.jpg"
target=_blank>
<a shape="rect" coords="62,30,82,40"  href="triangle.jpg"
target=_blank >
<a shape="circle" coords="115,35,10"  href="star.jpg"
target=_blank >
</map>
[/sourcecode]
Click on the shapes to watch them:

Shapes




Here in the above HTML Anchor Tag Shape Attribute example we can see that we have defined the “Circle” and “Star” containing image areas as “Circle” format and the area having the triangle as “Rect” format.


HTML Anchor Tag Shape Attribute Supporting Browsers

S. No. Browser Supported(Yes/No)
1 Internet Explorer No
2 Firefox Yes
3 Google Chrome No
4 Opera Yes
5 Safari No

Leave a Reply

Your email address will not be published. Required fields are marked *