Há uma diferença entre inserir uma imagem em uma página da web e tornar essa imagem um link clicável. Embora o HTML seja semelhante, um link depende de um âncora elemento enquanto uma imagem usa o img elemento. No entanto, uma imagem pode ser aninhada em uma âncora, tornando essa imagem clicável como um link.
Inserindo imagens em elementos âncora
Um uso comum de um link baseado em imagem é o gráfico do logotipo do site, que é então vinculado à página inicial do site. Veja como você colocaria uma imagem não clicável no documento HTML:
Para transformar a imagem em um link, adicione o link âncora, abrindo o elemento âncora antes da imagem e fechando a âncora depois da imagem. Essa técnica é semelhante a como você vincula texto, exceto que em vez de embrulhar as palavras, você embrulha a imagem:
Ao adicionar este tipo de HTML à sua página, não coloque nenhum espaço entre a tag âncora e a tag da imagem. Se você fizer isso, alguns navegadores adicionarão pequenas marcas ao lado da imagem, o que parecerá estranho. O logotipo agora também atua como um botão da página inicial, que é praticamente um padrão da web nos dias de hoje. Observe que não incluímos nenhum estilo visual, como largura e altura da imagem, em nossa marcação HTML. Deixaremos esses estilos visuais para CSS e manteremos uma separação clara da estrutura HTML e dos estilos CSS.
Formato mla apa chicago Sua Citação
Kyrnin, Jennifer. “Como vincular uma imagem em seu site.” ThoughtCo, maio. 14 de 2021, thinkingco.com/link-an-image-on-your-website-3468291.
Kyrnin, Jennifer. (2021, 14 de maio). Como vincular uma imagem em seu site. Obtido em https://www.thoughtco.com/link-an-image-on-your-website-3468291
Kyrnin, Jennifer. “Como vincular uma imagem em seu site.” ThoughtCo. https://www.thoughtco.com/link-an-image-on-your-website-3468291 (acessado em 28 de maio de 2021).
