Atributo shape do HTML <area>

Etiqueta HTML <area>

Definição e uso

shape define a forma da área.

shape A propriedade Atributo coords Juntos, definem o tamanho, forma e posição da área.

Exemplo

Use o atributo shape para especificar a forma de cada área no mapeamento de imagens:

<map name="planetmap">
<area shape="rect" coords="0,0,114,576" href="sun.html" alt="Sun">
<area shape="circle" coords="190,230,5" href="mercur.html" alt="Mercury">
<area shape="circle" coords="228,230,5" href="venus.html" alt="Venus">
</map>

Experimente você mesmo

Sintaxe

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

Valor da propriedade

Valor Descrição
default Especificar toda a área.
rect Definir a área do retângulo.
circle Definir a área do círculo.
poly Definir a área do polígono.

Explicação detalhada:

shape A propriedade é usada para definir a forma da área sensível ao mouse no mapeamento de imagens:

  • Círculo (circ ou circle)
  • Polígono (poly ou polygon)
  • Retângulo (rect ou rectangle)

shape O valor da propriedade afeta a interpretação do atributo coords pelo navegador. Se não for usado shape Se a propriedade não for especificada e nem incluído 4 valores coords no tag, o navegador ignorará toda a área.

reconhece shape Os navegadores que podem fornecer uma área que inclui todos os pontos quentes, para uso em situações onde o clique está fora do escopo dos pontos quentes definidos. Como a ordem de prioridade dos pontos quentes no tag <map> é "primeiro a chegar, primeiro a ser servido", todos os pontos quentes padrão devem ser colocados no final. Caso contrário, o ponto quente padrão cobrirá todos os outros pontos quentes que aparecem em outras imagens mapeadas.

Os navegadores não têm exigências rigorosas em relação à implementação de nomes de forma. Por exemplo, para retângulos, o Netscape 4 não reconhece "rectangle", mas reconhece "rect". Por essa razão, recomendamos o uso de nomes abreviados.

Suporte de navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte

Etiqueta HTML <area>