<img>

Imagem

Definição:

A tag <img> vem do inglês image e significa imagem. Esta tag permite que uma imagem seja apresentada na página.

Esta tag não possui um terminador, ou seja a tag na linguagem XHTML é declarada como <img />.

O atributo alt é obrigatório na linguagem XHTML.

Suporte:

Netscape: 1.0
Internet Explorer: 1.0
Aceito nas especificações DTD: Estrito, Transicional e Frameset

Dicas:

Utilize imagens corretamente formatadas para a internet para agilizar a transferência desta para o navegador. Imagens que só serão apresentadas nas páginas devem ter uma resolução máxima de apenas 72dpi.

Setar as dimensões da imagem através de atributos da tag ajuda o navegador alocar as areas a serem ocupadas pela imagem antes que esta seja carregada.

Todos os atributos de formatação da tag <img> são considerados obsoletos e já não são suportados na especificação DTD estrito.

Exemplo:

Código Resultado
<img src="/images/parede.jpg" alt="Telefone e quadro" /> Telefone e quadro

Atributos Obrigatórios:

Atributo Valor Descrição
alt descrição_da_imagem Especifica uma descrição para a imagem. No Internet Explorer o valor desta tag é apresentado como uma caixa de texto quando o usuário parar o mouse sobre a figura. No entanto a proposta deste atributo é que seu valor será apresentado no lugar da figura caso o navegador não suporte imagens.
src URL Especifica o caminho de um arquivo com a imagem a ser apresentada na página. Os formatos tipicamente aceitos são: jpg (ou jpeg), gif, png e bmp.

Atributos Padrão:

class, id, lang, style, title

Atributos Opcionais:

Atributo Valor Descrição
align bottom
middle
left
right
top

Especifica o alinhamento da imagem em relação ao texto ao redor. Caso haja algum texto ao redor da imagem, ele será acomodado ao redor de acordo com o alinhamento. Note que este atributo é considerado obsoleto e não será suportado na próxima revisão da linguagem. Recomenda-se utilizar folhas de estilo em cascata (CSS) para configurar o alinhamento.

bottom = em baixo
left        = esquerda
middle = no meio
right      = direita
top        = em cima

border pixels Especifica a espessura da borda ao redor da figura. Se este valor for 0 nenhuma borda será colocada. Note que este atributo é considerado obsoleto, recomenda-se utilizar folhas de estilo em cascata (CSS).
height pixels
%
Especifica a altura da imagem. Se a atgura da imagem for diferente do valor especificado, a imagem será re-dimensionada de acordo.
ismap -

Especifica um mapeamento da imagem no lado do servidor de modo que diferentes partes da imagem sejam associadas a links para outras páginas. Este comportamento é similar ao obitido através das tags <area><map>.

Este atributo é usado em conjunção com o atributo <a>.

longdesc URL Especifica o caminho para uma página contendo mais informações sobre a imagem.
usemap URL Especifica o mapeamento da imagem no lado do cliente. O mapeamento pode ser definido através das tags <area> ou <map>.
vspace pixels Especifica um espaçamento acima e abaixo da imagem. Este atributo é considerado obsoleto. Recomenda-se utilizar folhas de estilo em cascata (CSS).
width pixels
%
Especifica a largura da imagem. Se a largura da imagem for diferente do valor especificado, a imagem será re-dimensionada de acordo.

Eventos Associados:

onclick, ondblclickonkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup