|
Curso de html para Cegos. Aula 6 - Fundos de Tela e Cores.
Podemos ter o fundo de duas maneiras:
1. com uma cor uniforme.
Fundos com uma cor uniforme.
Consegue-se com o comando BGCOLOR com a etiqueta <BODY>, da seguinte maneira:
<BODY BGCOLOR="#XXYYZZ">
onde:
XX é o número indicativo da quantidade de cor vermelho
(Red).
Estes números estão em hexadecimal. Esta numeração se caracteriza por ter 16
dígitos (no lugar dos dez da nossa numeração decimal habitual). Estes dígitos
são:
As cores primárias são:
#FF0000 - Vermelho.
Outras cores são:
#FFFFFF - Branco.
Para fazer uma cor mais escura, temos que reduzir o número correspondente,
deixando os outros invariáveis. Assim o vermelho #FF0000 se pode fazer mais
escuro com #AA0000, ou ainda mais escuro com #550000
(quanto mais próximo do 00 mais escuro e do ff mais claro).
Para fazermos cores mais suaves, devemos variar as outras duas cores
deixando-as mais claras (número mais alto), em uma quantidade igual. Assim,
podemos converter o vermelho em rosa com #FF7070.
Todas as cores iguais dá o cinza:
Quanto mais claro, maior são os números (exemplos:
#404040 (escuro),
#909090 (médio)
#CCCCCC (claro).
Cores do texto e dos links
Se não se variassem as cores habituais do texto e dos links (preto e azul,
respectivamente), poderia ocorrer que a página contra o fundo escuro
ficasse difícil ou impossível de ser lida.
Para evitar isto, podemos escolher as cores do texto e dos links, com os
seguintes comandos:
<BODY BGCOLOR="#XXYYZZ" TEXT="#XXYYZZ" LINK "#XXYYZZ" VLINK="#XXYYZZ"
ALINK="#XXYYZZ">
Trocando a cor de uma parte do texto:
O comando TEXT explicado anteriormente (que vai englobado dentro da etiqueta
<BODY>), troca a cor da totalidade do texto de uma página.
A etiqueta <FONT COLOR> e </FONTt> troca a cor do texto de uma determinada
parte da página:
<FONT COLOR="#bb0000"> Este texto está em vermelho,
</FONT>
Fundos com uma imagem:
O fundo de uma página pode ser também uma imagem, no formato GIF ou JPG. Esta
imagem se repete por toda a página, de uma maneira análoga ao papel de parede
do Windows, na opção lado-a-lado. A estrutura da etiqueta é:
<BODY BACKGROUND="imagem.gif">
Podemos aninhar a esta etiqueta os comandos para trocar as cores do texto e
dos links, vistos anteriormente. Isto é imprescindível as vezes para conseguir
que o texto seja legível, em contraste com o fundo.
Temos que prever a possibilidade de que quem acesse nossa página tenha
desabilitado a carga automática das imagens, fazendo com que nossa imagem de
fundo seja substituída por uma cor de fundo. Isto poderia ser muito
prejudicial se a cor do nosso texto ou dos links sejam as mesmas do fundo ou
uma cor de difícil contraste. A solução para este problema é colocarmos dentro
da etiqueta <BODY> os dois comandos BACKGROUND e BGCOLOR (nesta ordem), tendo
o cuidado de escolher uma cor uniforme de fundo parecido com o da imagem.
Por exemplo, suponhamos que queremos por como fundo a imagem cinza.jpg.
Escolhemos então uma cor parecida, ou seja, um cinza parecido, por exemplo,
#BBBBBB. A etiqueta seria assim:
<BODY BACKGROUND="cinza.jpg" BGCOLOR="#BBBBBB">
Exemplo prático.
Vamos colocar como fundo a imagem cinza.jpg, junto com um fundo alternativo de
cor cinza claro (#BBBBBB) e fazer que o texto seja de cor azul, no nosso
exemplo da aula04 (aula4.htm). Para isso, é necessário capturar a imagem
e guardá-la no mesmo diretório onde estamos gravando nossos exemplos
(isso já está sendo feito no nosso caso, estando todas as imagens
citadas no diretório remoto da geocities, aulas_html).
Para isso, carregamos num editor de textos o arquivo .aula5.html e
substituímos a etiqueta <BODY> por esta outra:
<BODY BACKGROUND="cinza.jpg" BGCOLOR="#BBBBBB" TEXT="#000090">
Gravamos nosso exemplo no diretório criado no primeiro capítulo, com o nome de
aula6.htm
Esta aula est&á abaixo em formato txt para download.
|