Html map
PRÓXIMO
Html source
ANTERIOR
Html mark
Postado: 7 de junho de 2022
Tempo de Leitura: < 1 Minuto
Html map
Neste artigo HTML veremos como usar o elemento HTML chamado tag <map>
A tag <map> é usada para definir um mapa de imagem. Um mapa de imagem é uma imagem com áreas clicáveis.
O atributo name obrigatório do <map> elemento está associado ao atributo usemap do <img> e cria um relacionamento entre a imagem e o mapa.
O elemento <map> contém vários elementos <area> , que definem as áreas clicáveis no mapa de imagem.
Veja o exemplo de mapa de imagem, com área clicável no código html:
<!DOCTYPE html>
<html>
<head>
<title>HTML map</title>
</head>
<body>
<img src="uploads/imagem.png" alt="Loop Nerd" usemap="#logo">
<map name="logo">
<area shape="rect" coords="0, 0, 50, 50" alt="Loop Nerd" href="uploads/imagem2.png">
</map>
</body>
</html>
Configurações padrão de CSS
A maioria dos navegadores exibirá o elemento <map> com os seguintes valores padrão:
map {
display: inline;
}
Observação
- O atributo usemap para a tag <img> deve ser o mesmo que o atributo name para a tag <map> criando um relacionamento entre esses dois elementos.
Neste artigo abordamos sobre a tag Html map.
Veja outros artigos sobre Tags HTML Lista Completa
Deixe um comentário