TPI 1 - HTML - Aula 9 - IMAGENS

TPI 1 - HTML - Aula 9 - IMAGENS

Podemos inserir imagens no corpo de nossa página através da TAG IMG, esta TAG não tem fechamento.

A sintaxe do comando é:

<img src="arquivo.ext" width="numero" height="numero" alt="texto" vspace="numero" hspace="numero border="numero" align="alinhamento" lowsrc="arquivo.ext">

onde :

IMG = IMAGE

Imagem

SRC = SOURCE

Origem o nome e se necessário o caminho do arquivo da imagem.

WIDTH -> LARGURA

Define uma largura para a imagem, mas aqui o tamanho do arquivo não é reduzido, posso dizer que seria somente a visualização em menor ou maior escola como um zoom.

HEIGHT -> ALTURA

Define uma altura para a imagem, mas aqui o tamanho do arquivo não é reduzido, posso dizer que seria somente a visualização em menor ou maior escola como um zoom.
CUIDADO : Alterar apenas altura ou largura da figura pode deixá-la desproporcional.

ALT = TEXTO ALTERNATIVO

exibe o texto no espaço antes de carregar a imagem e ao apontar o mouse ele exibe o texto, como dica.

VSPACE = VERTICAL SPACE

Margem nas partes superior e inferior da imagem

HSPACE = HORIZONTAL SPACE

Margem nas partes esquerda e direita da imagem

BORDER = BORDAS

exibe ou não uma borda ao redor da imagem.

ALIGN = ALINHAMENTO

Define o alinhamento da imagem e de seu texto adjacente. Podem ser top - bottom - left - right - middle

LOWSRC = LOW SOURCE

Origem de definção mais baixa de uma figura, pode ser até uma em preto e branco. É usado se a figura principal é de alta definição, e enquanto a página carrega a figura principal, a especificada neste parâmetro aparece para dar uma idéia ao usuário o que ele irá ver.Abaixo, a figura foi inserida com alinhamento à esquerda, com a seguinte sintaxe :

&lt;img src="ma2anosp.jpeg" align="left"&gt; Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda.
Abaixo, a figura foi inserida com alinhamento à direita, espaçamento vertical e horizontal de 15 pixels, e borda espessura tamanho 4, com a seguinte sintaxe :

&lt;img src="ma2anosp.jpeg" align="right" vspace="15" hspace="15" border="4"&gt; Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda. Todo texto inserido em volta da foto, que está alinhada à esquerda.