Tutorial HTML - Formatação e aspecto - Parte 04
Todas as páginas que vemos na Internet têm algo mais que texto corrido
e monótono. Antes de mais, podemos mudar a cor de uma página:
<HTML><HEAD><TITLE>Página com
cor</TITLE></HEAD>
<BODY BGCOLOR="#FFFF00" TEXT="#0000FF" LINK="#FF0000"> Texto normal<BR><A HREF="outra.htm">Texto com link</A> </BODY> </HTML>
O resultado será o seguinte:
|
||||||||||||||
 |
||||||||||||||
Aqui foram acrescentados três parâmetros adicionais ao ‘tag’ <BODY>. BGCOLOR define
a cor de fundo da página, TEXT a cor por default (padrão) do texto, LINK a
cor de uma hiper-ligação.
Existem ainda os parâmetros adicionais ALINK e VLINK que definem, respectivamente, a cor de uma ligação ativa (quando se clica sobre ela) e a cor de uma ligação já vista previamente. |
||||||||||||||
Dicas:
|
||||||||||||||
|
||||||||||||||
No entanto, muitas vezes muito mais importante
que as cores, é o alinhamento dos elementos da página. Por default (padrão)
tudo fica alinhado à esquerda, mas é possível mudar isso:
<BODY>
<DIV ALIGN="CENTER">TEXTO CENTRADO</DIV> <DIV ALIGN="RIGHT">TEXTO À DIREITA</DIV> Texto à esquerda </BODY> O texto em maiúsculas tem o seu alinhamento alterado, a utilização do ‘tag’ <DIV> também provoca quebras de linha: |
||||||||||||||
 |
||||||||||||||
Porquê? O ‘tag’ <P> é
utilizado para a definição de parágrafos, como o seguinte exemplo o
demonstra:
<BODY>
<P>Bloco de texto</P> <P>Outro bloco de texto<BR>com mudança de linha</P> </BODY>
Existe uma diferença clara
entre o espaçamento introduzido por uma mudança de parágrafo e aquele que
surge através do ‘tag’ <BR>, de quebra de linha:
|
||||||||||||||
Além do aspecto global do
texto, podemos também escolher o tipo de letra que utilizamos. Antes de mais,
temos os ‘tags’ <B>, <I> e <U>,
respectivamente para letra carregada, em itálico e sublinhada:
<BODY>
Normal<BR> <B>Carregado</B><BR> <I>Italico</I><BR> <U>Sublinhado</U><BR> <B><I>Carregado e Italico</I></B> </BODY> Obtemos este resultado: |
 |
|
<BODY>
<P>Letra normal</P> <P><FONT FACE="Arial">Letra com a fonte Arial</FONT></P> <FONT FACE="Arial"> <P><FONT SIZE="5">Tamanho 5</FONT></P> <P><FONT SIZE="2">Tamanho 2</FONT></P> <FONT SIZE="5"> <P><FONT COLOR="#0000FF">Azul T.5</FONT></P> <P><FONT COLOR="#FF0000">Vermelho T.5</FONT></P> </FONT> </FONT> <P><FONT FACE="Times New Roman" SIZE="7" COLOR="#006633"> Podemos combinar varios parametros</FONT></P> </BODY> Este já está um pouco mais complicado. Existem várias maneiras de fazer isto, mas esta demonstra como se devem hierarquizar os ‘tags’ corretamente. Bem executado, teremos este resultado: |
O
parâmetro COLOR, que já vimos aplicado no ‘tag’ <BODY>,
contém a cor do texto no seu código hexadecimal. O parâmetro SIZE contém
o tamanho do tipo de letra, que é um algarismo entre 1 (mais pequeno) e 7
(maior). Finalmente, FACE contém o nome do tipo de letra a
utilizar.
|
Dica:
|
Apesar de existirem inúmeros tipos de letra, é aconselhável que uma
página apenas utilize o Arial ou o Times New Roman, visto que com outros
existe uma grande possibilidade que quem vai visitar a página não tenha essa
fonte instalada no seu computador.
|
.jpg)
