Anda di halaman 1dari 7

AG8 Informtica

FONTES

Para fazer alteraes no tamanho, tipo e cor da fonte de seu texto voc
utilizar a tag <font> </font> que do tipo continer. Sua sintaxe a seguinte:
<font
size=" "
face=" "
color=" ">
</font>

1. SIZE
O tamanho Size especifica o tamanho da fonte utilizada. Os valores
permitidos vo de 1, o menor, a 7, o maior. O padro 3. Se for especificado
um nmero antecedido com o sinal de adio ou subtrao o valor da fonte
ser acrescido ou subtrado nesse valor. Vamos a um exemplo: se eu estiver
trabalhando com uma fonte 5 e for especificado <font size=+2, o texto passar
a ser exibido em 7. Se no houver sinal a fonte ser exibida naquele valor.

2. FACE
Esse parmetro permite que seja escolhida uma fonte diferente para o
texto. Podem ser especificadas vrias fontes, de maneira que, se o sistema
no possuir uma determinada fonte ele ir utilizar outra.
Face="name [,name2[,name3]]
Se no forem encontradas as fontes especificadas, ento, o texto ser
apresentado na fonte padro.
<font face="Agaramond, Arial" size=1>

3. COLOR
Este parmetro especifica a cor do texto. Seu valor ser especificado no
formato hexadecimal, RGB ou atravs de um nome predefinido de cores.

46

AG8 Informtica
Algumas cores:

COR

Aqua
Black
Fuchsia
Green
Brown
Olive
Silver
White

CDIGO

#70DB93
#000000
#FF00FF
#00FF00
#800000
#808000
#E6E8FA
#FFFFFF

COR

Blue
Cyan
Gray
Lime
Navy
Red
Teal
Yellow

CDIGO

#0000FF
#00FFFF
#C0C0C0
#32CD32
#23238E
#FF0000
#008080
#FFFF00

Vamos a um exemplo de cdigo:

<html>
<head>
</title>Experincia com Fontes</title>
</head>
<body>
<h2>Primeiro exemplo com tipos de fontes</h2>
<font face="Agaramond"><p>
Este texto ser exibido em Agaramond</font><br>
<font face="Tahoma"><p>
Este texto ser exibido em Tahoma</font><br>
<font face="Arcane"><p>
Este texto ser exibido em Aracane</font><br>
<p>
<h2>Exemplos com tamanhos diferentes de fontes</h2>
<font face="Courier" Size=1>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=2>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=3>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=4>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=5>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=6>
Este texto ser exibido em Courier</font><br><p>
<font face="Courier" Size=7>
Este texto ser exibido em Courier</font><br><p>
<p>
<h2>Agora iremos usar cores</h2>
<font Face="Verdana" size=5 color="#800000">
Este o primeiro texto a ser modificado</font>
</body>

47

AG8 Informtica
</html>

4. ALINHAMENTO
Pense no que alinhar um texto no Word ou no StarWrite. Pois ento
voc sabe o que alinhar um texto. claro que voc no ir alinhar em HTML
da mesma forma, ter que utilizar tags e parmetros para estas tags.
Para alinhar um texto voc utilizar o atributo ALIGN com valores : LEFT
(esquerda), RIGHT (direita), CENTER (centralizado) e JUSTIFY (justificado).

PARGRAFOS
O comando <p> inicia um novo pargrafo onde o texto
automaticamente alinhado pela margem esquerda da tela. Caso voc deseje
que seu novo pargrafo seja iniciado com um alinhamento diferente voc
dever especificar na hora que incluir esta tag o atributo align.
Vejamos um exemplo:
<html>
<head>
<title>Alinhamento</title>
</head>
<body>
<h1>MACROMEDIA FLASH</H1>
<P ALIGN=JUSTIFY>
A tecnologia Shockwave Flash, da Macromedia, j est presente na Web h
alguns anos, e no ltimo no ganhou um forte impulso com a incluso do plug-in
necessrio nos navegadores mais recentes (apartir do Internet Explorer 4 e
Netscape Navigator 4.6). Cada vez mais utilizado, este programa j est sendo
empregado em sites de grandes empresas. Seu poder se deve a sua grande
capacidade multimdia e sua versatilidade. Sua finalidade a criao de
imagens vetoriais com animao, som e interatividade.</p>
<p align=center>
Depois veremos mais sobre o Flash</p>
</body>
</html>

CABEALHO
Quanto ao cabealho voc s poder alterar o alinhamento para direita e
centralizado, a esquerda alinhamento padro.

48

AG8 Informtica
Exemplo:
<h2 align=center>Este um exemplo de cabealho com alinhamento</h2>
Vamos ao cdigo-fonte para verificarmos a diferena:

<html>
<head>
<title>Alinhamento de cabealho</title>
</head>
<body>
<h2>Cabealho sem alinhamento especial</h2>
Este um exemplo do cabealho sem alinhamento especial.
<h2 align=center>Cabealho com alinhamento centralizado</h2>
Este um exemplo de cabealho alinhado ao centro.
<h2 align=right>Cabealho com alinhamento a direita</h2>
Este um exemplo de cabealho alinhado a direita.
</body>
</html>

5. ALINHAMENTO COM O COMANDO <DIV>


A utilizao desta tag uma forma prtica e rpida de alinhar bloco de
texto. A abreviatura DIV significa diviso. Ao usar esta tag num bloco de texto
voc estar atingindo todas as tags dentro daquele bloco. Suas vantagens
sobre o Align que:
1. Precisar ser utilizada apenas uma vez, ao contrrio do atributo Align, que
tem de ser includo em diversas tags.
2. A tag <DIV> pode ser usada para alinhar qualquer elemento (cabealho,
pargrafos, citaes, imagens, tabelas, etc.). O atributo Align encontra-se
disponvel apenas em um nmero limitado de tags.
Voc dever colocar a tag <DIV> e acrescentar o atributo align na tag de
abertura. O atributo align poder ter os valores left, right e center.

Sintaxe:
<DIV ALIGN=" ">
TEXTO e OUTRAS TAGS
TEXTO e OUTRAS TAGS
</DIV>

49

AG8 Informtica
OBSERVAO:
Alm do atributo align=center temos a tag <center>
funciona igualmente ao atributo.

</center> que

Vamos treinar um pouco com este cdigo-fonte:


<html>
<head>
<title>Utilizando a tag DIV para alinhar</title>
</head>
<body>
<h2>JavaScript na World Wide Web</h2>
<p align=justify>
A World Wide Web iniciou-se como um simples repositrio de informaes,
mas cresceu muito alm disso. A medida que a Web desenvolveu-se, as
ferramentas tambm desenvolveram-se. Ferramentas simples de marcao
como HTML foram unidas por linguagens de programao de verdade.
Incluindo <b>JavaScript</b>, que na verdade no uma linguagem de
programao mas uma <b>linguagem Script hospedeira</b> de pginas em
HTML.<br>
<p>
<div align=center>
<h2>Entendendo a utilidade do JavaScript</h2>
Como a HTML uma linguagem apenas de marcao de texto simples, ela
no pode responder para o usurio, tomar decises, nem autorizar tarefas
repetitivas. Tarefas interativas como essas exigem uma linguagem mais
complexa.
<h3>Eu precisarei usar JavaScript em todas as minhas pginas</h3>
Apenas se quiser aprimor-las e interagir com o usurio.
</div>
</body>
</html>

6. CARACTERES ESPECIAIS
H caracteres que no podem ser obtidos por meio do teclado. Eles
podem ser inseridos em sua pgina atravs da especificao de um cdigo
especial que o browser interpreta e substitui por um caracter especfico. Esses
cdigos podem ser obtidos utilizando-se uma nomeclatura definida pela ISO LATIN - 1 ou a partir de uma entidade HTML.

50

AG8 Informtica
A norma ISO utiliza um cdigo composto pelo caractere & seguido do
smbolo # e, ento, de uma combinao numrica com ponto-e-vrgula. J a
entidade HTML usa o caractere & seguido de uma palavra que identifica o
smbolo com ponto-e-vrgula.
Caso voc queira escrever uma pgina HTML em outro idioma ter que
usar bastante esses caracteres especiais.
Imagine que voc queira fazer uma pgina HTML ensinando a outras
pessoas a linguagem HTML. Como faria para explicar uma tag sem que o
browser interpretasse como um comando. Ter de utilizar estes smbolos
especiais.

Vamos a um exemplo:
<html>
<head>
<title>Tutorial em HTML</title>
</head>
<body>
<h2>O comando &ltBR&gt</h2>
A finalidade deste comando HTML marcar uma seo do texto como
pargrafo inserindo uma quebra de linha.<br>
<p>
J o comando &ltP&gt para indicar incio de uma novo pargrafo.
</body>
</html>
Observe que para que o browser pudesse mostrar <br> e <p> sem
interpretar como comandos usei caracteres especiais &lt para indicar sinal de <
e &gt para indicar o sinal de >.
Quando voc utiliza a acentuao comum do teclado nas suas pginas
podem at parecer que tudo ir correr tudo bem. Mas algum que visualizar
suas pginas em um computador que no tenha as mesmas configuraes de
'vdeo e teclado, alguns caracteres podem no sair da forma desejada.
Por exemplo:
A palavra caf, se voc utilizar esta palavra com a acentuao do seu teclado,
com certeza na visualizao do seu browser ficar perfeita, mas pode ser que
em outros computadores com a configurao diferente no aparea da mesma
forma. O ideal coloc-la assim:
Caf&eacute;

ou

ca&#233;

51

AG8 Informtica

E se desejasse colocar a palavra entre aspas:


&quot;Caf&eacute;&quot

ALGUNS CARACTERES ESPECIAIS


CARACTER
ESPECIAL
<
>
{
}
:
;
=

@
$
%

SMBOLO
&lt
&gt
&#123;
&#125;
&#58;
&#59;
&#61;
&aacute;
&#64;
&#36;
&#37;

CARACTER
ESPECIAL

&

"
"

SMBOLO
&agrave;
&acirc;
&atilde;
&uuml;
&#38;
&#174;
&#34;
&quot;
&ordf;
&ordm;
&#63;

EXERCCIOS
1- Crie uma pgina HTML utilizando os recursos vistos acima. Use esta pgina
para falar da utilidade da Internet na vida de pessoas que no trabalham
com informtica, sugestes para aqueles que querem abrir negcios novos
envolvendo Internet, sem ser um racker.

ANOTAES

52

Anda mungkin juga menyukai