Como criar mapas de imagens em HTML?

Pergunta

* Rede de conhecimento computador >> Pergunta >> PC Resolução de problemas >> Content

Para criar um mapa de imagem em HTML, você precisará usar os elementos ` ` e ``. Aqui está um guia passo a passo:

1. Crie uma imagem:
- Comece criando um arquivo de imagem (por exemplo, "image.jpg").

2. Defina o mapa de imagem:
- No código HTML, crie um elemento ` ` e atribua a ele um ID exclusivo (por exemplo, "mapa de imagem").

3. Defina áreas clicáveis:
- Dentro do elemento ` `, use o elemento `` para definir áreas clicáveis na imagem. Cada elemento `` representa uma região clicável.

4. Especifique as coordenadas do mapa de imagem:
- Para cada elemento ``, especifique as coordenadas que definem os limites da região clicável. Isso pode ser feito usando o atributo `coords`. As coordenadas são especificadas como uma lista separada por vírgulas, representando as coordenadas superior esquerda (x1, y1) e inferior direita (x2, y2) da área.

5. Definir ação para cliques:
- Use o atributo `href` dentro de `` para especificar a ação que deve ocorrer quando um usuário clica naquela região específica da imagem. Pode ser um link para outra página, um endereço de e-mail ou qualquer outro URL válido.

6. Associar mapa de imagem à imagem:
- Para conectar o mapa de imagem com a imagem, use o atributo `usemap` dentro do `

```

Neste exemplo, há uma imagem chamada “image.jpg” com duas áreas clicáveis. A primeira área é definida por um retângulo com coordenadas (10, 10) e (150, 150), e ao clicar, você será levado ao “link-1.html”. A segunda área é definida por um círculo com centro em (200, 200) e raio de 50, e é vinculada a "link-2.html" quando clicada.

Este é apenas um exemplo básico. Você pode criar mapas de imagens mais complexos com múltiplas formas e ações diferentes para cada região clicável.

Anterior : Como criar links de e-mail HTML com assunto, CC e CCO?

Próximo : Como criar formulários em HTML?

Os artigos relacionados

·	E se o iTunes não diz Dispositivos Quando Você Ligar …
·	Como redefinir o Kindle Fire de fábrica [dezembro de 2…
·	O que é um arquivo JPEG NCO
·	Como reproduzir música no Echo e no alto-falante Bluet…
·	Você pode alterar o nome de usuário do Depop?
·	Como encontrar LM Hash em um computador
·	Meu Laptop HP Pavilion não vai Rip CDs : toca música …
·	Como reparar um DC Jack MA3
·	Por que e como desativar as experiências de otimizaçã…
·	Como bloquear Auto Discadores

Artigos em destaque

·	Como corrigir problemas com drivers do computador
·	Como limpar arquivos DLL
·	Como usar GPO para Screensavers
·	Como corrigir uma tela Microsoft XP Azul da Morte
·	Como solução de problemas básicos Competências para…
·	Como transmitir Netflix no Kodi
·	Como verificar a versão do firmware do Magic Keyboard …
·	Como ler um mau disco rígido
·	Por que não posso ouvir o áudio em Meu Computador
·	Como causar BSOD manualmente no Windows:6 melhores mane…