Pular para o conteúdo
Herbário do HTML

/static/herbario/disruptivo/especime/map/

Menu

HTM-019 · Embutido

<map>

Regiões clicáveis desenhadas por cima de uma imagem.

Sobrevivente dos anos 1990. <map> agrupa elementos <area>, cada um com shape — retângulo, círculo ou polígono —, coords, href e alt. A imagem se liga ao mapa pelo atributo usemap.

O problema é que as coordenadas são pixels medidos na imagem original, o que combina mal com imagens fluidas. Hoje o mesmo efeito costuma ser feito com SVG e links de verdade.

<img src="/imagens/prancha.png" alt="Prancha de coleta" usemap="#prancha">

<map name="prancha">
  <area shape="rect" coords="0,0,240,240" href="/static/herbario/disruptivo/especime/figure/" alt="figure">
  <area shape="rect" coords="240,0,480,240" href="/static/herbario/disruptivo/especime/picture/" alt="picture">
</map>
{esc(legenda)}