HTML Área
PRÓXIMO
HTML address
ANTERIOR
HTML base
Postado: 1 de abril de 2022
Tempo de Leitura: < 1 Minuto
HTML Área
A tag HTML <area> define uma área clicável ( ou ponto de acesso ) dentro de um mapa de imagem. Você pode associar um hiperlink a esta área clicável. Esta tag deve estar dentro de uma tag <map>.
Definição da Tag <area> !
A <area>tag define uma área dentro de um mapa de imagem (um mapa de imagem é uma imagem com áreas clicáveis).
<area> os elementos são sempre aninhados dentro de uma <map>tag.
Atributos !
Esta tag aceita muitos atributos conforme descrito abaixo.
- shape : A forma a ser mapeada na imagem, pode ser um “retrato”, um “círculo” ou um “poli”.
- coords : As coordenadas da forma.
- href : O href é o link para onde o usuário será direcionado após clicar na parte mapeada da imagem.
- alt : Texto alternativo para uma área clicável em um mapa de imagem.
- download : Destino de download quando o hiperlink é clicado.
- target : Contexto no qual abrir o recurso de link.
- hreflang : Idioma do URL segmentado.
- media : URL otimizado para mídia ou dispositivo.
- rel : Relação entre URL e documento.
- type : tipo de mídia de URL
Veja o exemplo no código Html!
<!DOCTYPE html>
<html>
<body>
<img src="html-css-jquery.png" alt="" width="300" height="119" usemap="#shapemap" />
<map name="shapemap">
<area shape="poly" coords="59,31,28,83,91,83" href= "imagem-html.png" alt="Triangle">
<area shape="circle" coords="155,56,26" href="imagem-css.png" alt="Circle">
<area shape="rect" coords="224,30,276,82" href= "imagem-jquery.png" alt="Square">
</map>
</body>
</html>
Deixe um comentário