• Skip to primary navigation
  • Skip to main content

Tech Honey

The #1 Website for Oracle PL/SQL, OA Framework and HTML

  • Home
  • HTML
    • Tags in HTML
    • HTML Attributes
  • OA Framework
    • Item in OAF
    • Regions in OAF
    • General OAF Topics
  • Oracle
    • statement
    • function
    • clause
    • plsql
    • sql
You are here: Home / HTML / Tags / Attributes / HTML Area Tag Shape Attribute

HTML Area Tag Shape Attribute

August 15, 2013 by techhoneyadmin

The HTML Area Tag Shape attribute defines the shape of the area, within an image, that can be clicked.

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

HTML Area tag Shape Attribute is always used with the HTML Area Coords Attribute to define the shape, size and even the placement of the area.


 Syntax of HTML Area Tag Shape Attribute

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

HTML Area Tag Shape Attribute Values

HTML Area Shape 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

Example of HTML Area Tag Shape Attribute

HTML Area Tag Shape Attribute code Output

Click on the shapes to watch them:

<img alt="Shapes" src=" HTMLAreaTagEx.gif" usemap="#shapemap" width="145" height="126" />
<map name="shapemap">
<area coords="25,30,12" shape="circle" href="Circle.jpg" target="_blank" type="image/gif" />
<area coords="62,30,82,40" shape="rect" href="triangle.jpg" target="_blank" type="image/gif" />
<area coords="115,35,10" shape="circle" href="star.jpg" target="_blank" type="image/gif" />
</map>
Click on the shapes to watch them:

Shapes

Here in the above HTML Area 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 Area Tag Shape Attribute Supporting Browsers

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

Filed Under: Attributes Tagged With: Area Shape attribute in HTML, Area shape HTML, area shape rect coords href, How to change clickable area shape in html, HTML area shape, HTML Area Shape attribute, HTML Area Shape attribute usage, html area shape circle, HTML area shape poly, html area shape rect, HTML area tag Shape attribute, HTML map area shape, HTMLAreaTagShapeAttribute, image map area coords, Using Area Shape attribute in HTML, Using HTML Area Shape attribute

Copyright © 2023 · Parallax Pro on Genesis Framework · WordPress · Log in