Oznaka <area>

Oznaka <area> določa območje znotraj slikovnega zemljevida (slikovni zemljevid je slika s področji, na katere je mogoče klikniti). Elementi <area> so vedno ugnezdeni znotraj oznake <map>. Atribut usemap v <img> je povezan z atributom imena elementa <map> in ustvarja razmerje med sliko in zemljevidom.

PRIMER

<!DOCTYPE html>
<html lang="sl">
<head>
    <meta charset="UTF-8">
    <title>slika s področji na katere je mogoče klikniti</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
</head>
<body>
<p>Klikni na vse slike, ki jih najdeš.</p>
<img src="/demo/area.png" alt="Oznaka <area>" 
width="500" height="300" style="border: 1px solid black" usemap="#zemljevid">

<map id="zemljevid" name="zemljevid">
    <area shape="rect" coords="2,12,217,64" alt="html" href="html.php" style="cursor: pointer;">
    <area shape="rect" coords="300,12,499,110" alt="css" href="css.php">
    <area shape="rect" coords="0,499,499,220" alt="javascript" href="javascript.php">
    <area shape="rect" coords="57,200,270,90" alt="php" href="php.php">
</map>
</body>
</html>

REZULTAT