HTMLforall

  HTML | PHP | Forum

HTML <area> tag

Syntax

<area>

Definition and Usage

The AREA element defines a map region in a client-side image map. Each map region is a piece of the image with a different action when clicked. This element is always nested inside a <map> tag.

Required Attributes

Attribute Value Description
alt text Specifies an alternate text for the area

Optional Attributes

Attribute Value Description
coords

if shape="rect" then
coords="left,top,right,bottom"

if shape="circle" then
coords="centerx,centery,radius"

if shape="poly" then
coords="x1,y1,x2,y2,..,xn,yn"

Specifies the coordinates for the clickable area
href URL Specifies the target URL of the area
nohref true
false
Excludes an area from the image map
shape rect
circle
poly
default
Defines a rectangular region
Defines a circular region
Defines a polygonal region
Defines the whole region
target _blank
_parent
_self
_top

Where to open the target URL.

  • _blank - the target URL will be opened in a new window
  • _self - the target URL will be opened in the same frame as it was clicked
  • _parent - the target URL will be opened in the parent frameset
  • _top - the target URL will be opened in the full body of the window

Standard Attributes

id, class, title, style, dir, lang, xml:lang, tabindex, accesskey

For a full description, go to Standard Attributes.

Event Attributes

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup, onfocus, onblur

For a full description, go to Event Attributes.

Example

Source Output
<p>Click on the dog:</p>

<img src ="dog.gif"
width="180" height="120"
alt="Dog"
usemap ="#dogmap" >

<map id ="dogmap"
name="dogmap">
  <area shape ="rect" coords ="40,28,148,106"
  href ="dog.htm" target ="_blank"
  alt="Dog" /> 
</map>

Click on the dog:

Dog Dog

 

Home

Learn HTML
HTML Tutorial

HTML Reference
HTML by function
HTML by Alphabet

HTML events
HTML attributes
HTML color names

Top-Level Elements
<!--...-->
<!DOCTYPE> 
<html>
<head>
<body>
<frameset>
Head Elements
<base>
<isindex>
<link>
<meta>
<script>
<style>
<title>
Generic Block-level Elements
<address>
<blockquote>
<center>
<del>
<div>
<h1> to <h6>
<hr>
<ins>
<isindex>
<noscript>
<p>
<pre>
Lists
<dd>
<dir>
<dl>
<dt>
<li>
<menu>
<ol>
<ul>
Tables
<caption>
<col>
<colgroup>
<table>
<tbody>
<td>
<tfoot>
<th>
<thead>
<tr>
Forms
<button>
<fieldset>
<form>
<input>
<label>
<legend>
<option>
<optgroup>
<select>
<textarea>
Special Inline Elements
<a>
<applet>
<area>
<basefont>
<bdo>
<br>
<font>
<iframe>
<img>
<map>
<object>
<param>
<q>
<script>
<span>
<sub>
<sup>
Phrase Elements
<abbr>
<acronym>
<cite>
<code>
<del>
<dfn>
<em>
<ins>
<kbd>
<samp>
<strong>
<var>
Font Style Elements
<b>
<big>
<i>
<s>
<small>
<strike>
<tt>
<u>
Frames
<frame>
<frameset>
<noframes>

 

Copyright 2005-8 Sunilcare.  All Rights Reserved.
Comments or suggestions? Contact us.About us