4.8. Introdução ao HTML: estrutura básica, tags e atributos: Tags de imagem (img)

Introdução ao HTML: Estrutura básica, tags e atributos: Tags de imagem (img)

HTML, ou Hyper Text Markup Language, é a linguagem de marcação padrão para a criação de páginas web. A estrutura básica de um documento HTML consiste em tags, que são usadas para definir elementos e atributos, que são usados para especificar as características desses elementos.

As tags HTML são a base de qualquer página web. Elas são usadas para criar e organizar o conteúdo da página, incluindo texto, imagens, links, listas, tabelas e muito mais. Cada tag é representada por um conjunto de caracteres cercado por sinais de menor e maior (< e >). Por exemplo, a tag <h1> é usada para definir um título de nível 1, a tag <p> é usada para definir um parágrafo e a tag <img> é usada para inserir uma imagem.

A tag de imagem <img> é uma das tags mais importantes no HTML. Ela permite que você insira imagens em sua página web, tornando-a mais atraente e informativa. A tag <img> é uma tag vazia, o que significa que não tem uma tag de fechamento. Em vez disso, ela usa atributos para especificar a imagem a ser exibida e outras características da imagem.

Como usar a tag de imagem <img>

Para inserir uma imagem em sua página web, você precisa usar a tag <img> com o atributo 'src'. O atributo 'src' especifica o URL da imagem que você deseja exibir. Por exemplo:

<img src="imagem.jpg">

Neste exemplo, a imagem 'imagem.jpg' será exibida na página web. A imagem deve estar no mesmo diretório que o arquivo HTML, ou você deve especificar o caminho completo para a imagem.

Atributos da tag de imagem <img>

Além do atributo 'src', a tag <img> também suporta vários outros atributos. Os mais comuns são 'alt', 'width' e 'height'.

O atributo 'alt' é usado para especificar um texto alternativo para a imagem, que será exibido se a imagem não puder ser carregada. Este é um atributo importante para a acessibilidade, pois permite que os usuários de leitores de tela entendam o conteúdo da imagem. Por exemplo:

<img src="imagem.jpg" alt="Descrição da imagem">

Neste exemplo, se a imagem não puder ser carregada, o texto 'Descrição da imagem' será exibido em seu lugar.

Os atributos 'width' e 'height' são usados para especificar a largura e a altura da imagem, respectivamente. Eles são especificados em pixels. Por exemplo:

<img src="imagem.jpg" alt="Descrição da imagem" width="500" height="300">

Neste exemplo, a imagem será exibida com uma largura de 500 pixels e uma altura de 300 pixels.

Em resumo, a tag de imagem <img> é uma parte essencial de qualquer página web. Ela permite que você insira imagens em sua página, tornando-a mais atraente e informativa. Ao usar a tag <img>, é importante lembrar de usar o atributo 'alt' para melhorar a acessibilidade e os atributos 'width' e 'height' para controlar o tamanho da imagem.

Próxima página do Ebook Gratuito:

13Introdução ao HTML: estrutura básica, tags e atributos: Listas em HTML

4 minutos