Exemplo
Como inserir uma imagem:
<img src="smiley.gif" alt="Smiley face" height="42" width="42">
Tente você mesmo " Mais "Tente você mesmo" exemplos abaixo.
Definição e Uso
O <img> tag define uma imagem em uma página HTML.
O <img> tag tem dois atributos necessários: src e alt .
Nota: As imagens não são tecnicamente inserido em uma página HTML, imagens estão ligadas a páginas HTML.O <img> tag cria um espaço de participação para a imagem referenciada.
Dica: Para fazer o link de uma imagem para outro documento, o, simplesmente ninho <img> tag dentro <a> tags.
Suporte a navegadores
| Elemento | |||||
|---|---|---|---|---|---|
| <img> | sim | sim | sim | sim | sim |
Diferenças entre HTML 4.01 e HTML5
Os following atributos: align, border, hspace e vspace não são compatíveis com HTML5.
Diferenças entre HTML e XHTML
Em HTML o <img> tag não tem nenhuma marca de fim.
Em XHTML o <img> tag deve ser devidamente fechado.
Atributos
= Novo em HTML5.
| Atributo | Valor | Descrição |
|---|---|---|
| align | top bottom middle left right | Não suportado em HTML5. Especifica o alinhamento de uma imagem de acordo com os elementos circundantes |
| alt | text | Especifica um texto alternativo para uma imagem |
| border | pixels | Não suportado em HTML5. Especifica a largura da borda ao redor de uma imagem |
| crossorigin | anonymous use-credentials | Permitir imagens de sites de terceiros que permitem o acesso de origem cruzada para ser usado com lona |
| height | pixels | Especifica a altura de uma imagem |
| hspace | pixels | Não suportado em HTML5. Especifica o espaço em branco no lado esquerdo e direito de uma imagem |
| ismap | ismap | Especifica uma imagem como uma imagem-map do lado do servidor |
| longdesc | URL | Especifica um URL para uma descrição detalhada de uma imagem |
| src | URL | Especifica a URL de uma imagem |
| usemap | #mapname | Especifica uma imagem como uma imagem-map do lado do cliente |
| vspace | pixels | Não suportado em HTML5. Especifica o espaço em branco no topo e fundo de uma imagem |
| width | pixels | Especifica a largura de uma imagem |
Atributos globais
O <img> tag também suporta o Global de Atributos em HTML .
Atributos de eventos
O <img> tag também suporta o evento Atributos em HTML .
Tente você mesmo - Exemplos
Inserir imagens de diferentes locais
Como inserir imagens de outra pasta ou de outro web site.
Faça um link de uma imagem
Como adicionar um link para uma imagem.
Criar um mapa de imagem
Como criar um mapa de imagem, com as regiões clicáveis. Cada região é um hiperlink.
Páginas relacionadas
Tutorial HTML: HTML Images
Referência HTML DOM: Objeto Imagem
Tutorial CSS: Styling Imagens
Configurações CSS padrão
A maioria dos navegadores irá exibir o <img> elemento com os seguintes valores padrão: