HTML: Inserção de imagens

HTML: Inserção de imagens

Inserção de Imagens

Para efetuar a inclusão de uma imagem basta seguir o padrão abaixo da tag <img>:

<img src="diretório/arquivo"> 

Neste caso, o src indica o caminho/pasta onde se encontra a imagem a ser inserida.

Por exemplo:
<IMG SRC="bola.jpg" WIDTH="45" HEIGHT="40" ALT="campainha">

insere o arquivo bola.jpg. Opcionalmente foi especificado também o tamanho (WIDTH e HEIGHT) em pixels da imagem, isto não é obrigatório, mas facilita o trabalho do Browser para desenhar a página e é recomendado usar. O item ALT="campainha" indica o texto alternativo que aparece no lugar da imagem se ela não for carregada por quem estiver vendo a página (por exemplo se a transmissão for interrompida antes da imagem chegar totalmente).

Toda imagem incluída pode ser posicionada (align=...) na tela das seguintes formas:

TOP, MIDDLE, BOTTOM, LEFT e RIGHT. 
As três primeiras opções definem a posição vertical da imagem com relação ao texto. Veja os exemplos:
<IMG SRC="bola. jpg " ALIGN="top" >
<IMG SRC="bola. jpg " ALIGN="middle" >
 <IMG SRC="bola.jpg" ALIGN="bottom" >
As duas últimas definem a posição da imagem na página, a direita ou esquerda:
<IMG SRC="bola. jpg " ALIGN="right" >
<IMG SRC="bola. jpg " ALIGN="left">
Caso seja omitida a opção "align", a imagem aparecerá a esquerda da página.

Uma imagem pode ser ainda um botão sensível: Para isso basta incluir uma imagem no interior de um link:
<a href="index.htm"><img src="indice. jpg "></a>


Background


É possível usar uma imagem como imagem de fundo (background) da página, que o Browser usa para preencher toda a tela como um papel de parede usando um recurso chamado de Tiling.

Para definir uma imagem como plano de fundo, coloque no comando <BODY> no início da página:

<BODY BACKGROUND="marble.jpg">