A maior rede de estudos do Brasil

Grátis
55 pág.
Apostila HTML

Pré-visualização | Página 3 de 17

Texto em estilo <BIG>Big</BIG> que cria letras grandes<BR> 
 Texto em estilo <SMALL>Small</SMALL> que cria letras pequenas<P> 
 Texto no formato <SUP>sobrescrito</SUP> pelo comando SUP.<P> 
 Texto no formato <SUB>subscrito</SUB> pelo comando SUB.<P> 
 Para chamar a <BLINK>ATENÇÃO</BLINK> use o comando BLINK.<BR> 
 </BODY> 
</HTML> 
1.6. ALTERANDO A FONTE 
Um dos recursos de tratamento do texto mais interessante da linguagem HTML é a 
possibilidade de alterar o tamanho, cor e tipo da fonte do texto utilizado. O comando 
responsável por isso é o <FONT>, que também é do tipo contêiner: 
 
<FONT size = n face = nome1, nome2, nome3 color = cor> </FONT> 
SIZE: Este parâmetro especifica o tamanho da fonte utilizada. Os valores permitidos 
vão de 1 a 7. O padrão é 3. Se for especificado um número antecedido pelo sinal de 
adição ou de subtração, o tamanho da fonte atual será aumentado ou diminuído naquele 
valor. Por exemplo, se a fonte atual é 3 e for especificado <font size=+2> o texto será 
exibido no tamanho 5. Note que esta numeração funciona de forma contrária aos 
números usados nos comandos de cabeçalho. Aqui, quanto menor o número, menor a 
fonte. 
FACE: Este parâmetro permite que seja escolhida uma fonte diferente para o texto. 
Podem ser especificadas várias fontes, de maneira que, se o sistema não possuir a 
primeira opção, a segunda é carregada e assim por diante. 
COLOR: Especifica a cor do texto. Seu valor pode ser especificado em hexadecimal, 
RGB ou através de um nome predefinido de cores como mostra a tabela: 
 
RED #FF0000 BLUE #0000FF WHITE #FFFFFF 
BLACK #000000 CYAN #00FFFF YELLOW #FFFF00 
FLUCHSIA #FF00FF GRAY #C0C0C0 SILVER #E6E8FA 
GREEN #00FF00 LIME #32CD32 TEAL #008080 
MAROON #800000 NAVY #23238E OLIVE #808000 
 
01 – O Básico 
HTML – Lucilia Ribeiro 7
 
EX04.HTML 
 
<HTML> 
 <HEAD> 
 <TITLE>ex04</TITLE> 
 </HEAD> 
 <BODY> 
 <H2>Exemplo de faces:</H2> 
 <FONT FACE='Verdana'> 
 Texto exibido na fonte Verdana </FONT><BR> 
 <FONT FACE='Courier New'> 
 Texto exibido na fonte Corurier New </FONT><BR> 
 <FONT FACE='TimesRoman'> 
 Texto exibido na fonte Times New Roman </FONT><BR> 
 <FONT FACE='VictorianD'> 
 Texto exibido na fonte VictorianD</FONT><BR> 
 <FONT FACE='xyz'> 
 Texto exibido na fonte XYZ que não existe na máquina</FONT> 
 <FONT SIZE=+2>Exemplo de size:</FONT><BR> 
 <FONT SIZE=7>Texto com tamanho de fonte 7</FONT><BR> 
 <FONT SIZE=6>Texto com tamanho de fonte 6</FONT><BR> 
 <FONT SIZE=5>Texto com tamanho de fonte 5</FONT><BR> 
 <FONT SIZE=4>Texto com tamanho de fonte 4</FONT><BR> 
 <FONT SIZE=3>Texto com tamanho de fonte 3</FONT><BR> 
 <FONT SIZE=2>Texto com tamanho de fonte 2</FONT><BR> 
 <FONT SIZE=1>Texto com tamanho de fonte 1</FONT><BR> 
 <FONT COLOR="#ffff00">Usando cores</FONT> 
 <FONT COLOR="#ff00ff">Usando cores</FONT> 
 <FONT COLOR=green>Usando cores</FONT> 
 <font color=red>Usando cores</FONT><BR> 
 <FONT SIZE=4 COLOR="blue" FACE='Verdana' > 
 Texto exibido na fonte Verdana cor Azul e tamanho 4</FONT><BR> 
 <FONT SIZE=2 COLOR="red" FACE='Arial' > 
 Texto exibido na fonte Arial cor vermelha e tamanho 2</FONT><BR> 
 Apenas <FONT SIZE=5 COLOR=green> parte </FONT> do texto pode ser mudada 
 </BODY> 
</HTML> 
1.7. CORES E PADRÕES DE FUNDO 
O mundo é colorido, não é? Então por que usar aquele fundo cinza ou branco que 
aparece como padrão toda vez que a página é criada? A maioria dos navegadores 
permite a utilização de cores no segundo plano da tela (background) assim como a 
utilização de imagens que podem ser utilizadas para enfeitar o fundo da tela. Vamos 
alterar os parâmetros do comando <body>, responsável pelas cores da página. 
 
<BODY bgcolor=#xxxxxx text = #xxxxxx link = #xxxxxx vlink = #xxxxxx> 
 
Onde xxxxxx deve ser substituído por um código que identifique a cor desejada para 
aquele elemento. bgcolor é a cor do fundo, onde o padrão é cinza ou branco. text é a 
cor do texto sendo que o padrão é preto, link é a cor do texto do link, tendo como 
padrão o azul e vlink é a cor do link visitado, padrão vermelho púrpura. 
 
EX05.HTML 
 
<HTML> 
 <HEAD> 
 <TITLE>Grécia </TITLE> 
 </HEAD> 
 <BODY bgcolor=yellow text=red link=black vlink=blue> 
01 – O Básico 
HTML – Lucilia Ribeiro 8
 <P>Grécia está localizada no sudeste da Europa e ocupa uma área total de 131.990 
km<SUP>2</SUP>. O país tem fronteiras para o norte com a Albânia, a ex-Iugoslávia, a 
Bulgária e para o leste com a Turquia, perfazendo um comprimento total de 1.228km. </P> 
 <P><FONT color="#0000FF" size="4">Uso da terra:</FONT> 23% terra cultivável; 40% 
prados e pastos; 20% florestas e bosques; 9%outros. </P> 
 </BODY> 
</HTML> 
1.8. OUTROS COMANDOS 
Além dos comandos de formatação apresentados, existem outros que ajudam e 
melhoram a legibilidade do texto: 
1.8.1 TEXTOS PRÉ-FORMATADOS 
Através do comando <PRE> você pode incluir um texto que foi editado por um editor 
de textos e preservar a formatação original do texto tais como marcas de tabulação, fim 
de linha gerado pela tecla enter e outros formatos. A sintaxe geral é: 
 
<PRE> texto 
...texto 
</PRE> 
1.8.2 CENTRALIZAÇÃO DE TEXTOS 
Como padrão, os textos inseridos em uma página HTML são alinhados à esquerda. 
Para centralizar um cabeçalho, parágrafo ou figura dentro da largura da página deve ser 
usado o comando <CENTER></CENTER>. 
1.8.3 LINHA DIVISÓRIA 
O comando <HR> tem como finalidade inserir uma linha divisória na posição em que 
foi especificado se ele for o único comando da linha ou na linha seguinte caso esteja no 
meio de um texto. Seu uso é recomendado para criar uma divisão na página, separando 
tópicos e assuntos distintos. Pode-se utilizar os atributos color, size e width. Este 
último designa qual a porcentagem que a linha ocupará na tela. Esse comando não 
precisa ser finalizado: 
 
<HR color=red size=3 width=50%> 
 
EX06.HTML 
 
<HTML> 
 <HEAD> <TITLE>ex06</TITLE> </HEAD> 
 <BODY> 
 Primeira linha de texto <BR>Segunda linha de texto <BR> Terceira linha de 
texto<BR>Agora veremos o uso comando hr.<BR> Ao ser inserido no meio desta linha ele 
mostra uma barra na próxima linha<HR> e continua o texto na linha seguinte.<BR> 
 Primeira linha de texto <HR color=red>Segunda linha de texto <HR color=blue size=3> 
 Terceira linha de texto<HR color=fuchsia size=5> 
 <HR color=olive size=10 width=50%> 
 <H1>Sem Centralizar</H1> 
 <CENTER><H1>Centralizado</H1></CENTER> 
 <PRE> 
Este texto está digitado utilizando enter para mudar de linha 
Como qualquer outro editor de texto. 
 A tabulação também foi incluída. 
 </PRE> 
 </BODY> 
</HTML> 
 
02 – Links e Listas 
HTML – Lucilia Ribeiro 9
 
Links e Listas 
 
 
 
“A maior dor do vento é não ser colorido” 
(Mário Quintana) 
 
2.1 LINKS 
Fazer a ligação de um texto com uma página local é uma tarefa bastante simples. Você 
precisa apenas especificar o nome completo do arquivo que será chamado, utilizando o 
comando <A> de âncora, onde href especifica o endereço da URL (Universal Resource 
Locator) ao qual o link está associado, pode ser uma outra página da internet, um arquivo 
para download ou até mesmo uma figura. Pode ser usada para referências dentro ou fora do 
documento e name especifica o nome da seção de um documento que é referida por um link 
de hipertexto. 
 
<A href=url name=nome> link </A> 
 
Exemplos: 
<A href=http://www.lucilia.com.br> página da profª lucília</A> 
<A name=inicio>Início da Página</A> 
<A href=#inicio>Vai para o início da página</A> 
<A href=pagina2.html#outra> outra parte da página 2</A> 
<A href=index.html>Página Principal</A> 
<A href=figura.jpg>Nome da Figura</A> 
<A href=turboc.zip>Baixe aqui</A> o Compilador C 
 
EX07A.HTML 
 
<HTML> 
 <HEAD> <TITLE>EX07A</TITLE> </HEAD> 
 <BODY> 
 <H1><A NAME=inicio>TESTANDO LINKS</A></H1> 
 <H3>Isto aqui é só para ocupar