Ir para conteúdo

Noções Basicas HTML - Imagens #2

Como inserir imagens e cores de fundo

Imagens de Fundo e Cores de Fundo

Cor de Fundo

 

Para usar cores de fundo deve-se procurar uma combinação entre a cor de fundo e a cor do texto que não dificulte a leitura. Normalmente as cores de fundo claras funcionam bem com uma cor de texto escura.
Para usar uma cor de fundo na sua página você deve usar o seguinte código dentro da tag <body>:
 

Spoiler

<body bgcolor="blue"> 

Pode também utilizar os códigos HEX para definir as cores que combinem melhor. 


Inserir uma Imagem de Fundo

Se você quiser definir uma imagem de fundo use o seguinte código:

Spoiler

<body background="fotos/imagem.jpg">

Lembre-se que "fotos/imagem.jpg" é a localização do ficheiro da imagem. Trata-se de um URL relativo que aponta para a pasta "fotos" que está no seu site. Pode também usar um URL absoluto, que pode também apontar para o seu site ou então para outra imagem localizada algures na internet. Um exemplo do código da imagem de fundo com URL absoluto é:

Spoiler

<body background="http://www.seudominio.com/fotos/imagem.jpg">

 

Inserir Imagens

A tag para se inserir imagens é <img src="imagem.jpg"> .
Deve-se ter em atenção que o endereço da imagem a introduzir em "src" deve ter em conta a pasta onde a imagem está arquivada no servidor. Assim se a nossa página estiver na raiz, e a imagem estiver numa pasta chamada "fotos", a nossa tag para aquela imagem deveria ser:

Spoiler

<img src="fotos/imagem.jpg"> .

Atributo "alt"

O atributo "alt" deve ser usado para quando queremos que um texto apareça sempre que passarmos o rato sobre a imagem. Este texto também aparece como texto descritivo quando a exibição das imagens não está ativa. A tag fica:

Spoiler

<img src="imagem.jpg" alt="Aniversário da Joana"> 


Definir Altura e Largura
Para a largura usa-se o atributo "width" e para altura o "height". Podem-se definir os valores em pixels ou em percentagem:
 

Spoiler

<img src="imagem.jpg" width="200" height="100">

Definir Altura e Largura
Para a largura usa-se o atributo "width" e para altura o "height". Podem-se definir os valores em pixels ou em percentagem:
 

Spoiler

<img src="imagem.jpg" width="200" height="100">

Múltiplos Atributos

Se quisermos definir as dimensões da imagem, um contorno, e um texto "alt", podemos definir a tag com todos esses atributos. A ordem em que os colocamos não é importante:

 

Spoiler

<img src="imagem.jpg" border="5" alt="Aniversário da Joana" width="200" height="100"> 

 




×
×
  • Criar Novo...

Informação Importante

Termos de Uso Política de Privacidade Regras