Tag <img>

Definições e uso

A tag <img> é usada para incorporar uma imagem em uma página HTML.

As imagens não são tecnicamente inseridas em uma página da web; as imagens são vinculadas às páginas da web. A tag <img> cria um espaço reservado para a imagem referenciada.

A tag <img> tem dois atributos obrigatórios:

src - Especifica o caminho para a imagem
alt - Especifica um texto alternativo para a imagem, caso a imagem, por algum motivo, não possa ser exibida.

Nota: sempre especifique a largura e a altura de uma imagem. Se a largura e a altura não forem especificadas, a página poderá piscar enquanto a imagem é carregada.

Dica: para vincular uma imagem a outro documento, basta aninhar a tag <img> dentro da tag <a> (veja o exemplo abaixo).

Exemplos


<img src="img_girl.jpg" alt="Garota com uma jaqueta" width="500" height="600">


<!DOCTYPE html>
<html>
<body>

<h1>Tag img</h1>

<img src="img_girl.jpg" alt="Garota com uma jaqueta" width="500" height="600">

</body>
</html>

Resultado

Atributos

Atributo	Valor	Descrição
Alt	Texts	Especifica um texto alternativo para uma imagem
Crossorigin	Anonymous Use-credentials	Permite que imagens de sites de terceiros que permitem acesso de origem cruzada sejam usadas com o canvas
Height	Pixels	Especifica a altura de uma imagem
Ismap	Ismap	Especifica uma imagem como um mapa de imagem no lado do servidor (server-side image map)
Loading	Eager⁄Lazy	Especifica se o navegador deve carregar uma imagem imediatamente ou adiar o carregamento de imagens até que algumas condições sejam atendidas
Longdesc	URL	Especifica uma URL para uma descrição detalhada de uma imagem
Referrerpolicy	no-referrer no-referrer-when-downgrade origin origin-when-cross-origin unsafe-url	Especifica qual informação do referenciador usar ao buscar uma imagem
Sizes	Sizes	Especifica os tamanhos de imagem para diferentes layouts de página
Scr	URL	Especifica o caminho para a imagem
Scrset	URL-List	Especifica uma lista de arquivos de imagem para usar em diferentes situações
Usermap	#mapname	Especifica uma imagem como um mapa de imagem do lado do cliente
Width	Pixels	Especifica a largura de uma imagem

Esta tag também suporta Atributos Globais.