Baixe o app para aproveitar ainda mais
Leia os materiais offline, sem usar a internet. Além de vários outros recursos!
Programaçao HTML
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Compartilhar
Prévia do material em texto
P R O G R A M A Ç Ã O
HTML
CADERNO DE
EXERCÍCIOS
PRÁTICOS
Prof. Celso Gallão
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 1
CADERNO DE EXERCÍCIOS DE HTML
Linguagem Gráfica de Programação I
Hiper Text Markup Language
Este material contém exercícios referentes ao Resumo das Aulas de HTML.
Exercício 01: Salvar como EXE01.htm:
<HTML><!-- EXERCÍCIO 01 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O1</TITLE>
</HEAD>
<BODY>
<H1>Minha 1ª Página Web - Exercício 01</H1>
<H3>Nome, Nº e Turma dos Integrantes</H3>
<HR>
<H6>Colégio Singular Informa:</H6> os alunos do
<B>Curso Técnico em Informática</B>, na
disciplina de <I>LGP</I>,
<BR>iniciaram a edição de <U>Páginas Web</U>,
utilizando a programação
<I><B><U>HTML</U></B></I>.
<HR>
Desta forma, <BIG>em breve</BIG>, eles serão
<H2>Web Designers</H2>
</BODY></HTML>
Exercício 02: Salvar como EXE02.htm:
<HTML><!-- EXERCÍCIO 02 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O2</TITLE>
</HEAD>
<BODY>
<H1>Minha 2ª Página Web - Exercício 02</H1>
<H3>Nome, Nº e Turma dos Integrantes</H3>
<HR><B>LISTAS ORDENADAS</B>
<OL>
<LI>Volkswagen</LI>
<OL>
<LI>Gol</LI>
<LI>Parati</LI>
<LI>Golf</LI>
</OL>
<LI>Fiat</LI>
<OL>
<LI>Uno</LI>
<LI>Palio</LI>
<LI>Stilo</LI>
</OL>
</OL>
<HR><B>LISTAS NÃO ORDENADAS</B>
<UL>
<LI>General Motors</LI>
<UL>
<LI>Celta</LI>
<LI>Corsa</LI>
<LI>Astra</LI>
</UL>
<LI>Ford</LI>
<UL>
<LI>Ka</LI>
<LI>Fiesta</LI>
<LI>Ecosport</LI>
</UL>
</UL>
</BODY></HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 2
Exercício 03:
Salvar como EXE03.htm. Editar conforme as orientações e Lay-Out abaixo:
Exercício 03 - Microsoft Internet Explorer
ORIENTAÇÕES
���� Cabeçalho 1
���� Cabeçalho 3
���� Linha Horizontal
���� Texto em Negrito com letra maiúscula.
���� Linha Horizontal
���� Lista Ordenada com 2 itens em
Negrito, com 2 sub-itens em Lista Não
Ordenada em Itálico.
���� Linha Horizontal
���� Texto em Negrito com letra maiúscula.
���� Linha Horizontal
���� Lista Não Ordenada com 2 itens em
Negrito, com 3 sub-itens em Lista
Ordenada em Itálico.
Exercício 04:
Salvar como EXE04.htm:
<HTML><!-- EXERCÍCIO 04 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O4</TITLE>
</HEAD>
<BODY>
<H1>Utilizando Links - Exercício 04</H1>
<H3>Nome, Nº e Turma dos Integrantes</H3>
<HR>
<A HREF="EXE01.htm">Exercício 01</A>
<P>
<A HREF="EXE02.htm">Exercício 02</A>
<P>
<A HREF="EXE03.htm">Exercício 03</A>
<P>
<A HREF ="http://www.celsogallao.hpg.com.br">
Página do Professor Gallão</A>
<P>
<A HREF ="mailto:celsogallao@ig.com.br">
E-Mail para o Professor Gallão</A>
</BODY></HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 3
Exercício 05: Salvar como EXE05.htm:
<HTML><!-- EXERCÍCIO 05 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O5</TITLE>
</HEAD>
<BODY>
<H1>Utilizando Imagens - Exercício 05</H1>
<H3>Nome, Nº e Turma dos Integrantes</H3>
<HR>
<IMG SRC="figura01.gif" ALIGN="top">
Texto alinhado pelo TOPO da figura.<P>
<IMG SRC="figura01.jpg" ALIGN="middle">
Texto alinhado pelo MEIO da figura.<P>
<IMG SRC="figura01.bmp" ALIGN="bottom">
Texto alinhado pela BASE da figura.<P>
<A HREF="mailto:celsogallao@ig.com.br">
<IMG SRC="Figura2.jpg" WIDTH="100"
ALT="E-Mail para o Professor Gallão"></A>
Esta figura é um link, e teve seu comprimento
alterado para 100px.
<BR>
<A HREF="EXE04.htm">
<IMG SRC="Figura2.jpg" HEIGHT="50"
ALT="Exercício 04"></A>
Esta figura é um link, e teve sua altura alterada
para 50px.
<BR>
Obs.: Repare que, alterando apenas uma medida, a
outra se ajusta proporcionalmente.
</BODY></HTML>
Exercício 06: Salvar como EXE06.htm:
<HTML><!-- EXERCÍCIO 06 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O6</TITLE>
</HEAD>
<BODY BGCOLOR="purple" TEXT="white"
LINK="green" VLINK="black" ALINK="pink">
<CENTER>
<H1>Alterando Cores - Exercício 06</H1>
<H3>Nome, Nº e Turma dos
Integrantes</H3>
</CENTER>
<HR SIZE="5" WIDTH="300" ALIGN="left">
A utilização de cores em Páginas Web deve ser
feita com cautela e bom senso,<BR>
pois da mesma forma que podem <B>ENCANTAR</B>,
podem também <B>ESPANTAR</B> os visitantes.
<HR SIZE="5" WIDTH="300" ALIGN="right">
<CENTER>
<A HREF ="exe03.htm">Exercício 03</A><br>
<A HREF ="exe04.htm">Exercício 04</A><br>
<A HREF ="exe05.htm">Exercício 05</A>
</CENTER>
</BODY></HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 4
Exercício 07: Salvar como EXE07.htm:
<HTML><!-- EXERCÍCIO 07 HTML - Prof. Celso Gallão -->
<HEAD>
<TITLE>Exercício O7</TITLE>
</HEAD>
<BODY BGCOLOR=”GREEN” TEXT=”YELLOW”
<H1>Alinhando Parágrafos – Exercício 07</H1>
<H3>Nome, Nº e Turma dos Integrantes</H3>
<HR>
<!-- Alinhando à DIREITA -->
<H2 ALIGN="right">Melhorando a Página</H2>
<HR WIDTH="220" ALIGN="right">
<DIV ALIGN="right">
Aqui estamos usando o TAG < DIV ><BR>
para alinhar este texto à direita.
</DIV>
<HR WIDTH="530" ALIGN="right">
<!-- Alinhando ao CENTRO -->
<P ALIGN="center">
Este texto foi centralizado
utilizando o TAG < P >.
</P>
<HR WIDTH="530" ALIGN="left">
<FONT SIZE="3" FACE="verdana" COLOR="white">
<CENTER>
Este texto teve a fonte configurada
e também está centralizado,<BR>
mas utilizamos o TAG < CENTER >.
</CENTER></FONT>
<HR WIDTH="70%">
<!-- Texto em Movimento Alternado -->
<MARQUEE BEHAVIOR="alternate">
Texto em Movimento Alternado
</MARQUEE>
</BODY></HTML>
Exercício 08:
Salvar como EXE08.htm. Editar conforme as orientações e Lay-Out abaixo:
ORIENTAÇÕES Exercício 08 - Microsoft Internet Explorer
� Corpo Principal: Fundo = azul, Link = amarelo, Textos =
#FFFFFF, Link Visitado = #00FF00,
Link em Acesso = vermelho.
� Texto em arial, 4, azul-claro, negrito, à direita:
Exercício 08
� Texto em movimento da direita para a esquerda, em arial,
5, prata, negrito: Aluno 1 - Aluno 2
Linha Horizontal: espessura 1, comprimento 100%.
� Texto em cabeçalho 2:
Melhorando o Visual
� Texto em arial, 3, amarelo, negrito:
A aplicação de cores e alinhamentos faz com que
a página web fique mais atraente!
� Texto em arial, 2, cor #FFAAAA:
Clique nos exercícios abaixo e veja páginas
formatadas:
� Links:
Exercício 06 - acesso à página Exe06.htm.
Exercício 07 - acesso à página Exe07.htm.
Linha Horizontal: espessura 5, comprimento 300px.
� Texto em cabeçalho 2, ao centro:
Utilizando Tabelas
� Texto em arial, 3, amarelo, negrito, ao centro:
A utilização de Tabelas permite a formatação de objetos (textos e imagens) lado-a-lado!
� Texto em arial, 2, cor #FFAAAA, ao centro:
Veja a utilização nos exercícios abaixo:
� Links:
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 5
Exercício 14 - acesso à página Exe14.htm.
Exercício 15 - acesso à página Exe15.htm.
(Estas páginas ainda não foram editadas, portanto não queira testá-las agora!).
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 6
Exercício09:
Salvar como EXE09.htm. Editar conforme as orientações e Lay-Out abaixo:
ORIENTAÇÕES
Exercício 09 - Microsoft Internet Explorer
� Corpo Principal: Fundo com Imagem LgSingBk.gif, Link =
vermelho, Textos = #505050, Link Visitado = laranja,
Link em Acesso = verde.
� Texto em movimento alternado, em arial, 3, cor #005500,
negrito:
Exercício 09: Aluno 1 - Aluno 2
� Linha Horizontal:
espessura 2, comp. 100%, cor verde-escuro.
� Texto em cabeçalho 1:
Utilizando Frames
� Linha Horizontal:
espessura 5, comp. 400px, cor laranja, à direita.
� Texto em arial, 3, laranja, negrito, à direita, em 3 linhas, com quebra de parágrafo ao final:
Com os Frames fazemos subdivisões na Página
permitindo carregar várias Páginas na mesma janela!
Estudaremos Frames mais adiante.
� Texto em arial, 2, cor #000055, negrito, à direita, em 3 linhas, com quebra de linha ao final:
Os exercícios abaixo mostram páginas web com Frames,
mas você somente poderá acessá-las
após elas serem editadas, é claro.
� Links, à direita, um em cada linha:
Exercício 16 - acesso à página Exe16.htm.
Exercício 17 - acesso à página Exe17.htm.
� Linha Horizontal:
espessura 5, comp. 360px, cor azul-escuro, à direita.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 7
Exercício 10:
Editar e salvar com o nome de EXE10.htm:
<HTML><!---- EXERCÍCIO 10 - HTML ---->
<!--- Informações de Cabeçalho --->
<head><title>Exercício 1O</title></head>
<!--- Corpo Principal da Página --->
<body bgcolor="#AAAAFF" text="darkblue" link="blue" vlink="ligthblue" alink="white">
<h1 align=”center”>Utilizando Âncoras</h1>
<h3 align=”center”><font color="white">Nome, Nº e Turma dos Integrantes</font></h3>
<a name="topo"></a>
<!--- Links para as âncoras --->
<a href="#LO">Lista Ordenada</a><br>
<a href="#LNO">Lista Não Ordenada</a><br>
<a href="#LAO">Lista Aninhada Ordenada</a><br>
<a href="#LANO">Lista Aninhada Não Ordenada</a> <p>
<!--- 1ª âncora --->
<HR>
<a name="LO"></a><h2 align="center">Lista Ordenada</h2><HR>
<OL>
<LI>Curso Técnico em Informática
<LI>Curso Técnico em Turismo
</OL>
<a href="#topo">Volta ao Início</a>
<br>
<!--- 2ª âncora --->
<HR><a name="LNO"></a><h2 align="center">Lista Não Ordenada</h2><HR>
<UL>
<LI>Curso Técnico em Eletrônica
<LI>Curso Técnico em Química
</UL>
<a href="#topo">Volta ao Início </a><br>
<!--- 3ª âncora --->
<HR><a name="LAO"></a><h2 align="center">Lista Aninhada Ordenada</h2><HR>
<OL>
<LI> Curso Técnico em Informática
<OL>
<LI>Manhã
<LI>Noite
</OL>
<LI> Curso Técnico em Turismo
<OL>
<LI>Manhã
<LI>Noite
</OL>
</OL>
<a href="#topo">Volta ao Início </a><br>
<!--- 4ª âncora --->
<HR><a name="LANO"></a><h2 align="center">Lista Aninhada Não Ordenada</h2><HR>
<UL>
<LI> Curso Técnico em Eletrônica
<UL>
<LI>Manhã não tem
<LI>Noite
</UL>
<LI> Curso Técnico em Química
<UL>
<LI>Manhã não tem
<LI>Noite
</UL>
</UL>
<a href="#topo">Volta ao Início </a><br>
</BODY></HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 8
Exercício 11:
Editar e salvar com o nome de EXE11.htm:
<HTML><!---- EXERCÍCIO 11 - HTML - PROF. CELSO GALLÃO ---->
<head><title>Exercício 11</title></head>
<body bgcolor="#AA00AA" text="orange" link="gray" vlink="yellow" alink="pink">
<h1 align="right">Acessando Âncoras Externas</h1>
<h3 align="right"><font color="silver">Nome, Nº e Turma dos Integrantes</font></h3>
<HR>
<B><font size="4">Os links abaixo acessarão as âncoras existentes no Exercício 10:</font></b>
<p>
<a href="exe10.htm#LO">Lista Ordenada</a><br>
<a href="exe10.htm#LNO">Lista Não Ordenada</a><br>
<a href="exe10.htm#LAO">Lista Aninhada Ordenada</a><br>
<a href="exe10.htm#LANO">Lista Aninhada Não Ordenada</a><p>
<HR>
</BODY>
</HTML>
Exercício 12: Editar e salvar com o nome de EXE12.htm de tal forma que a página seja exibida conforme o Lay-Out abaixo:
Exercício 12 - Microsoft Internet Explorer
Listas, Links e Âncoras
Nomes dos Integrantes
1. Nome Completo do Aluno 1
2. Nome Completo do Aluno 2
3. Nome Completo do Aluno 3
Dados Pessoais
1. Apelido do Aluno 1
• Endereço:
• Data de Nascimento:
• Descrição Física:
• Passatempos:
• Enviar E-Mail para mim
Voltar ao topo
2. Apelido do Aluno 2
• Endereço:
• Data de Nascimento:
• Descrição Física:
• Passatempos:
• Enviar E-Mail para mim
Voltar ao topo
3. Apelido do Aluno 3
• Endereço:
• Data de Nascimento:
• Descrição Física:
• Passatempos:
• Enviar E-Mail para mim
Voltar ao topo
Cabeçalho 1, Centralizado, definir cor.
Linha Horizontal
Texto Normal, Centralizado, definir cor.
Linha Horizontal
Lista Ordenada, em Negrito, com Links para
Âncoras nesta Página Web. Definir cor para
Link, Link Visitado e Link em Acesso.
Linha Horizontal
Texto Normal, Centralizado, definir cor.
Linha Horizontal
Lista Aninhada Ordenada em Negrito, com sub-
itens Não Ordenados em Itálico, definir cor.
Link somente na palavra “E-Mail” com o
endereço de e-mail do referido aluno.
Links para Âncora chamada #topo para exibir o
topo da Página Web, com fonte normal.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 9
Exercício 13:
Salvar como EXE13.htm. Editar conforme as orientações e Lay-Out abaixo:
ORIENTAÇÕES
Exercício 13 - Microsoft Internet Explorer
� Corpo Principal: Fundo Azul-claro, Link = vermelho,
Textos = #000055, Link Visitado = preto,
Link em Acesso = branco.
� Texto em cabeçalho tamanho 2:
Exercício 13 - Imagens e Âncoras Externas
� Linha Horizontal:
espessura 5, comp. 60%, cor azul-escuro, ao centro.
� Texto em arial, 5, marrom, negrito, ao centro:
IMAGENS DOS INTEGRANTES
� Linha Horizontal:
espessura 3, comp. 80%, cor vermelho-escuro, ao
centro.
� Inserir 3 figuras, lado a lado, através de tabela:
� Tabela sem borda, com 1 linha por 3 colunas.
� Em cada célula haverá uma figura e um texto.
� As figuras são: foto1.jpg, foto2.jpg e foto3.jpg, todas com borda tamanho 5.
� As figuras são links que acessam as âncoras externas de cada aluno, respectivamente, descritas no EXERCÍCIO 12.
� Os textos com os nomes dos alunos devem estar sob cada figura, centralizados e em negrito.
� Linha Horizontal:
espessura 3, comp. 80%, cor vermelho-escuro, ao centro.
� Texto em arial, 5, marrom, negrito, ao centro:
ACESSO PARA O PORTAL SINGULAR - ANGLO
� Inserir 3 figuras, lado a lado, através de tabela:
� Tabela com borda vermelha tamanho 3, com 1 linha por 3 colunas e cor de fundo amarelo.
� Em cada célula haverá a figura LgSingP.jpg com 200px de comprimento e um texto.
� As figuras são links que acessam as seguintes páginas web:
• 1ª Célula: http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares/ensinomediod.htm
• 2ª Célula: http://www.singular.com.br
• 3ª Célula: http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares/ensinomedion.htm
� Os textos devem estar sob cada figura, centralizados e em negrito, e devem ser:
• 1ª Célula: Colégio Singular - Diurno
• 2ª Célula: Portal Singular - Anglo
• 3ª Célula: Colégio Singular - Noturno
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 10
Exercício 14:
Salvar como EXE14.htm. Editar conforme as orientações e Lay-Out abaixo:
ORIENTAÇÕES
Exercício 14 - Microsoft Internet Explorer
� Corpo Principal: Fundo Prata.
� Texto em Arial, 3, cor R=00 G=55 B=00, negrito ao centro:
Exercício 14 - Utilizando Tabelas Mescladas
� Texto em Arial, 2, cor R=55G=00 B=00, negrito ao centro:
Aluno 1 - Aluno 2
� Linha Horizontal:
espessura 2, comp. 100%, cor branco.
� Tabela com 3 linhas e 4 colunas:
� Comprimento 100%, cor do fundo cinza-escuro.
� Com borda tamanho 1, cor prata.
� Rótulo da Tabela: Tabela Não Mesclada
� Todas as células alinhadas ao centro e com os seguintes textos:
A1 A2 A3 A4
B1 B2 B3 B4
C1 C2 C3 C4
� Tabela com 3 linhas e 4 colunas:
� Comprimento 100%, cor do fundo rosa.
� Com borda tamanho 3, cor vermelha.
� Rótulo da Tabela: Tabela Mesclada
� Todas as células mescladas e alinhadas conforme abaixo:
A2
A3
A1
B2
B4
C1
A1: Comprimento 10%, alinhamento à esquerda, cor do fundo amarela.
A2: Comprimento 40%, altura 40px, alinhamento ao centro, alinhamento vertical na base, cor do fundo branca.
A3: Comprimento 50%, alinhamento ao centro, alinhamento vertical no topo, cor do fundo laranja.
A4: Mesclado com A3.
B1: Mesclado com A1.
B2: Comprimento 40%, altura 50px, alinhamento ao centro, cor do fundo laranja.
B3: Mesclado com B2.
B4: Comprimento 30%, alinhamento ao centro, cor do fundo amarela.
C1: Comprimento 10%, alinhamento à direita, cor do fundo laranja.
C2: Mesclado com C1.
C3: Mesclado com C1.
C4: Mesclado com B4.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 11
Exercício 15:
Salvar como EXE15.htm. Editar conforme as orientações e Lay-Out abaixo:
ORIENTAÇÕES
Exercício 15 - Microsoft Internet Explorer
� Corpo Principal: Fundo com Imagem = LgSingBk.gif.
� Texto em Arial, 5, cor R=00 G=55 B=00, negrito ao centro:
Exercício 15 - Nossas Notas da 1ªUL/2006
� Tabela com 5 linhas e 7 colunas: Comprimento 100%,
borda tamanho 5, cor da borda azul-escuro e espaço
entre as células 0.
� Configuração das Linhas:
• 1ª Linha: cor do fundo = “#8888FF”, altura 50px,
textos em arial, branco e negrito.
• 2ª Linha: cor do fundo = “#BBBB00”.
• 3ª Linha: cor do fundo = “#EEEEEE”.
• 4ª Linha: cor do fundo = “#EEEEEE”.
• 5ª Linha: cor do fundo = “#EEEEEE”.
� Configuração dos Textos:
• Texto “Turma”: fonte arial, tamanho 4, branca, negrito, centralizado, com fundo preto. Comprimento da célula = 100px.
• Texto “TO”: fonte verdana, tamanho 5, vermelha, alinhado à direita, na margem superior.
• Texto “FI”: fonte verdana, tamanho 5, vermelha, alinhado ao centro.
• Texto “TCG”: fonte verdana, tamanho 5, vermelha, alinhado à esquerda, na margem inferior.
• Textos “AT”, “PO”: fonte arial, tamanho 3, marrom, negrito, centralizado. Comprimento das células = 80px.
• Textos “MÉDIAS”: fonte arial, tamanho 3, preto, negrito, centralizado.
• Notas de AT e PO de TO: fonte padrão, tamanho 5, marrom, itálico, negrito, alinhados na margem superior à direita.
• Notas de AT e PO de FI: fonte padrão, tamanho 5, marrom, itálico, negrito, alinhados ao centro.
• Notas de AT e PO de TCG: fonte padrão, tamanho 5, marrom, itálico, negrito, alinhados na margem inferior à esquerda.
• Médias de TO: fonte padrão, tamanho 7, preto, itálico, alinhados na margem superior à direita.
• Médias de FI: fonte padrão, tamanho 7, preto, itálico, alinhados ao centro.
• Médias de TCG: fonte padrão, tamanho 7, preto, itálico, alinhados na margem inferior à esquerda.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 12
Exercício 16-A:
Salvar como EXE16A.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página Principal:
• Título no Navegador = Exercício 16 - Página Principal
• Borda = Não
• Espaço entre os frames = Não
• Caso o navegador não aceite FRAMES:
� Configurar a cor do fundo da página vermelha e os textos amarelos.
� Exibir a mensagem “Este navegador não aceita FRAMES!”
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 16 - Página Principal - Microsoft Internet Explorer
Configuração do Frame:
• Comprimento = 200px
• Borda = Não
• Espaço entre os frames = Não
• Nome = FrEsquerda
• Carregar a Página = Exe16B.htm
• Barra de Rolagem = Não
• Permitir Redimencionamento = Não
Configuração do Frame:
• Comprimento = resto da tela
• Borda = Não
• Espaço entre os frames = Não
• Nome = FrDireita
• Carregar a Página = Exe16C.htm
• Barra de Rolagem = Sim
• Permitir Redimencionamento = Não
� Abaixo segue o código-fonte:
<HTML>
<!---- EXERCÍCIO 16-A - PROF. CELSO GALLÃO ---->
<!---- PÁGINA PRINCIPAL DOS FRAMES ---->
<HEAD>
<TITLE>Exercício 16 - Página Principal</TITLE>
</HEAD>
<FRAMESET COLS="200,*" FRAMEBORDER="0" FRAMESPACING="0">
<FRAME NAME="FrEsquerda" SRC="Exe16b.htm" SCROLLING="no" NORESIZE>
<FRAME NAME="FrDireita" SRC="Exe16c.htm" SCROLLING="yes" NORESIZE>
</FRAMESET>
<NOFRAMES>
<BODY BGCOLOR="red" TEXT="yellow">
<CENTER><B>
O seu Navegador não suporta FRAMES, esta página não pode ser mostrada!
</B></CENTER>
</BODY>
</NOFRAMES>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 13
Exercício 16-B:
Salvar como EXE16B.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página da Esquerda:
• Título no Navegador = Exercício 16-B - Página para o Frame da Esquerda.
• Cor do fundo = Laranja, cor dos textos = Azul-escuro.
• Cor dos links = Marrom, cor dos links visitados = Branco e cor dos links em acesso = Verde.
� Texto, em duas linhas, “Exercício 16 Utilizando Frames”:
• Fonte arial, tamanho 3, cor #005500, centralizado e negrito.
� Linha Horizontal, espessura 3, cor marrom, comprimento 100%.
� Texto, em duas linhas, com o NOME e Nº dos alunos”:
• Fonte arial, tamanho 3, cor marrom, centralizado e negrito.
� Linha Horizontal, espessura 3, cor marrom, comprimento 100%.
� Texto, em duas linhas, “Esta Página está carregada no Frame da Esquerda”:
• Fonte arial, tamanho 2, cor #005500, centralizado e negrito.
� Dois links, em dois parágrafos:
• DESKTOPS, que carregará a página Exe16C.htm no FrDireita.
• LAPTOPS, que carregará a página Exe16D.htm no FrDireita.
� Abaixo segue o código-fonte:
<HTML>
<!---- EXERCÍCIO 16-B - PROF. CELSO GALLÃO ---->
<!---- PÁGINA DA ESQUERDA ---->
<HEAD>
<TITLE>Exercício 16-B - Página Para o Frame da Esquerda</TITLE>
<BASE TARGET = "FrDireita">
</HEAD>
<BODY BGCOLOR="orange" TEXT="darkblue" LINK="browm" VLINK="white" ALINK="green">
<CENTER>
<FONT FACE="arial" SIZE="3" COLOR="#005500"><B>
Exercício 16<BR>
Utilizando Frames
</FONT>
<HR SIZE="3" COLOR="browm" WIDTH="100%">>
<FONT FACE="arial" SIZE="3" COLOR="browm">
Aluno 1 - Nº<BR>
Aluno 2 - Nº
</FONT>
<HR SIZE="3" COLOR="browm" WIDTH="100%">
<FONT FACE="arial" SIZE="2" COLOR="#005500">
Esta Página está carregada<BR>
no Frame da Esquerda<P>
</FONT>
<A HREF="Exe16c.htm">DESKTOPS</A><P>
<A HREF="Exe16d.htm">LAPTOPS</A>
</CENTER>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 14
Exercício 16-C:
Salvar como EXE16C.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página da Direita:
• Título no Navegador:
Exercício 16-C - 1ª Página para o Frame da Direita.
• Cor do fundo = Azul-escuro, e dos textos = Branco.
• Cor dos links = Amarelo.
• Cor dos links visitados = Azul-claro.
• Cor dos links em acesso = Laranja.
� Texto, em duas linhas, fonte arial, tamanho 3, cor padrão,
centralizado e negrito.
Esta é a Página 16C.
Está Carregada no Frame da Direita.
� Linha Horizontal,espessura 3, cor branca, tamanho 280px.
� Todos os textos a seguir devem ter a fonte arial, tamanho 3.
� Tabela com 2 Linhas e 6 Colunas:
• Comprimento 100%, borda tamanho 1, cor da borda amarela.
• Espaço entre as células = 3 e espaço entre o conteúdo e a borda da célula = 5.
• Rótulo da Tabela com o texto “Processadores em 2006”.
� Configuração dos Links INTEL e AMD.
• Ambas as células possuem 50% de comprimento e 50px de altura, centralizado e cor do fundo #0000FF.
• Link com imagem “ImLogoINTEL.jpg” e rótulo da imagem “Intel Corporation”:
� Acessará a URL http://www.intel.com.br
• Link com imagem “ImLogoAMD.jpg” e rótulo da imagem “Advanced Micro Devices”:
� Acessará a URL http://www.amd.com.br
� Configuração dos textos com os nomes dos processadores:
• Todos em negrito, centralizado. A linha tem altura de 100px e cor do fundo #000055.
Exercício 16-D: Salvar como EXE16D.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página da Direita:
• Título no Navegador:
Exercício 16-D - 2ª Página para o Frame da Direita.
• Cor do fundo = Verde-escuro.
• Cor dos textos = Amarelo.
• Cor dos links = Marrom.
• Cor dos links visitados = Cinza-Claro.
• Cor dos links em acesso = Laranja.
� Texto, em duas linhas, fonte arial, tamanho 3, cor padrão,
centralizado e negrito.
Esta é a Página 16D.
Está Carregada no Frame da Direita.
� Linha Horizontal, espessura 3, cor amarela, tamanho 280px.
� Todos os textos a seguir devem ter a fonte arial, tamanho 3.
� Tabela com 6 Linhas e 2 Colunas:
• Comprimento 100%, borda tamanho 1, cor da borda branca.
• Espaço entre as células = 3 e espaço entre o conteúdo e a borda da célula = 5.
• Rótulo da Tabela com o texto “Laptops em 2006”.
� Configuração dos Links INTEL e AMD. Ambas as células possuem 150px de comprimento, centralizado e cor do fundo #0000FF.
• Link com imagem “ImLogoINTEL.jpg” e rótulo da imagem “Intel Corporation”:
� Acessará a URL http://www.intel.com.br
• Link com imagem “ImLogoAMD.jpg” e rótulo da imagem “Advanced Micro Devices”:
� Acessará a URL http://www.amd.com.br
� Configuração dos textos com os nomes dos processadores:
• Todos em negrito, centralizado, cor branca. A linha tem cor do fundo #00AA00.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 15
� Abaixo segue o código-fonte do Exercício 16-C:
<HTML>
<!---- EXERCÍCIO 16-C - PROF. CELSO GALLÃO ---->
<!---- 1ª PÁGINA DA DIREITA ---->
<HEAD>
<TITLE>Exercício 16-C - 1ª Página para o Frame da Direita</TITLE>
</HEAD>
<BODY BGCOLOR="darkblue" TEXT="white" LINK="yellow" VLINK="lightblue" ALINK="orange">
<CENTER>
<FONT FACE="arial" SIZE="3"><B>
Esta é a Página 16C.<BR>
Está Carregada no Frame da Direita.
</FONT>
<HR SIZE="3" COLOR="white" WIDTH="280">
<FONT FACE="arial" SIZE="3">
<TABLE WIDTH="100%" BORDER="1" BORDERCOLOR="yellow" CELLSPACING="3" CELLPADDING="5">
<CAPTION>Processadores em 2006</CAPTION>
<TR BGCOLOR="#0000FF">
<TH COLSPAN="3" WIDTH="50%" HEIGHT="50">
<A HREF="http://www.intel.com.br">
<IMG SRC="ImLogoINTEL.jpg" ALT="Intel Corporation"></A></TH>
<TH COLSPAN="3">
<A HREF="http://www.amd.com.br">
<IMG SRC="ImLogoAMD.jpg" ALT="Advanced Micro Devices"></A></TH></TR>
<TR BGCOLOR="#000055" HEIGHT="100">
<TH>Pentium <sup>®</sup> 4 Extreme Edition </TH>
<TH>Pentium <sup>®</sup> D </TH>
<TH>Celeron <sup>®</sup> D </TH>
<TH>Athlon<BR>64 <sup><small>TM</small></sup> FX </TH>
<TH>Athlon<BR>64 <sup><small>TM</small></sup> X2 </TH>
<TH>Cempron <sup><small>TM</small></sup> </TH></TR>
</TABLE>
</FONT>
</CENTER>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 16
� Abaixo segue o código-fonte do Exercício 16-D:
<HTML>
<!---- EXERCÍCIO 16-D - PROF. CELSO GALLÃO ---->
<!---- 2ª PÁGINA DA DIREITA ---->
<HEAD>
<TITLE>Exercício 16-D - 2ª Página para o Frame da Direita</TITLE>
</HEAD>
<BODY BGCOLOR="darkgreen" TEXT="yellow" LINK="browm" VLINK="gray" ALINK="orange">
<CENTER>
<FONT FACE="arial" SIZE="3"><B>
Esta é a Página 16D.<BR>
Está Carregada no Frame da Direita.
</FONT>
<HR SIZE="3" COLOR="yellow" WIDTH="280">
<FONT FACE="arial" SIZE="3">
<TABLE WIDTH="100%" BORDER="1" BORDERCOLOR="white" CELLSPACING="3" CELLPADDING="5">
<CAPTION>Laptops em 2006</CAPTION>
<TR BGCOLOR="#00AA00">
<TH ROWSPAN="3" WIDTH="150">
<A HREF="http://www.intel.com.br">
<IMG SRC="ImLogoINTEL.jpg" ALT="Intel Corporation"></A></TH>
<TH><FONT COLOR="white">
Intel<sup>®</sup> Core<sup><small>TM</small></sup> Duo</FONT></TH></TR>
<TR BGCOLOR="#00AA00">
<TH><FONT COLOR="white">
Intel<sup>®</sup> Pentium<sup>®</sup> M</FONT></TH></TR>
<TR BGCOLOR="#00AA00">
<TH><FONT COLOR="white">
Intel<sup>®</sup> Celeron<sup>®</sup> M</FONT></TH></TR>
<TR BGCOLOR="#004400">
<TH ROWSPAN="3"><font color="white">
<A HREF="http://www.amd.com.br">
<IMG SRC="ImLogoAMD.jpg" ALT="Advanced Micro Devices"></A></TH>
<TH><FONT COLOR="white">
Turion<sup><small>TM</small></sup> 64</FONT></TH></TR>
<TR BGCOLOR="#004400">
<TH><FONT COLOR="white">
Mobile Athlon<sup><small>TM</small></sup> 64</FONT></TH></TR>
<TR BGCOLOR="#004400">
<TH><FONT COLOR="white">
Mobile Cempron<sup><small>TM</small></sup></FONT></TH></TR>
</TABLE>
</FONT>
</CENTER>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 17
Exercício 17-A:
Salvar como EXE17A.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página Principal:
• Título no Navegador = Exercício 17 - Página Principal
• Borda = Não
• Espaço entre os frames = Não
• Caso o navegador não aceite FRAMES:
� Configurar a cor do fundo da página vermelha e os textos amarelos.
� Exibir a mensagem “Este navegador não aceita FRAMES!”
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 17 - Página Principal - Microsoft Internet Explorer
Configuração do Frame:
• Comprimento = 100%
• Altura = 100 pixels
• Borda =
Não
• Espaço entre os frames = Não
• Nome = FrameAlto
• Carregar a Página = Exe17B.htm
• Barra de Rolagem = Não
• Permitir Redimencionamento = Não
• Distância entre as margens superior e inferior = 3 pixels
• Distância entre as margens direita e esquerda = 3 pixels
Configuração do Frame:
• Comprimento = 150 pixels
• Borda =
Não
• Espaço entre os frames = Não
• Nome = FrameEsquerda
• Carregar a Página = Exe17C.htm
• Barra de Rolagem = Automática
• Permitir Redimencionamento = Não
Configuração do Frame:
• Comprimento = resto da tela
• Borda =
Não
• Espaço entre os frames = Não
• Nome = FrameDireita
• Carregar a Página = Exe17D.htm
• Barra de Rolagem = Sim
• Permitir Redimencionamento = Não
• Distância entre as margens superior e inferior = 0 pixel
• Distância entre as margens direita e esquerda = 0 pixel
Exercício 17-B:
Salvar como EXE17B.htm. Editar conforme as orientações e Lay-Out abaixo:
� Título no Navegador: Exercício 17-B - Página para o Frame do Alto
• Cor do fundo = #AADDEE.
• Cor dos textos = Azul-escuro.
• Cor dos links = Marrom.
• Cor dos links visitados= Branco.
• Cor dos links em acesso = Prata.
� Tabela: comprimento 100%, sem bordas, sem espaço entre as células, conforme lay-out acima:
• 1ª Linha: cor da linha = Azul-claro, altura da linha = 50 pixels.
- 1ª Célula: comprimento da célula = 110 pixels, inserir a imagem = LgSing.gif com altura = 48 pixels.
- 2ª Célula: alinhamento = direita, negrito, texto: Exercício 17 - Frames Aninhados, fonte verdana, tamanho 4.
• 2ª Linha: cor da linha = Vermelho, altura da linha = 30 pixels.
- 1ª Célula: alinhamento = centralizado, negrito, texto: Aluno 1, Nº - Aluno 2, Nº, fonte arial, tamanho 5, cor = #FFFF00.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 18
Exercício 17-C:
Salvar como EXE17C.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página da Esquerda:
• Título no Navegador = Exercício 17-C - Página da Esquerda do Frame.
• Cor do fundo = #AADDEE
• Cor dos textos = Azul-escuro
• Cor dos links = Marrom
• Cor dos links visitados = Branco
• Cor dos links em acesso = Prata
� Inserir as duas figuras abaixo, centralizadas, sem bordas, com 130px de comprimento, e transformá-
las em links:
• BTexe17D.jpg (com a legenda “Abrir Página 17-D”) que carregará a página Exe17D.htm no
FrameDireita.
• BTexe17E.jpg (com a legenda “Abrir Página 17-E”) que carregará a página Exe17E.htm no
FrameDireita.
Exercício 17-D: Salvar como EXE17D.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da 1ª Página da Direita:
• Título no Navegador = Exercício 17-D - 1ª Página da Direita do Frame.
• Cor do fundo = #EEEEFF
• Cor dos textos = Azul-escuro
� Inserir tabela com 1 linha e 2 células: Comprimento de 100% da tela, sem bordas, espaço interno das células = 0px e espaço
entre as células = 0px.
• 1ª Célula:
o Comprimento de 30px, alinhamento horizontal à esquerda e alinhamento vertical ao topo.
o Inserir a imagem = ImCanto.gif, comprimento de 50px e altura de 50px.
• 2ª Célula:
o Alinhamento horizontal centralizado.
o Parágrafo com o texto “Esta é a 1ª Página da Direita”, fonte arial, 4.
o Linha Horizontal, comprimento de 300px, espessura de 5px, cor Azul-escuro.
o Texto “17D”, fonte arial, 7, itálico e negrito.
o Linha Horizontal, comprimento de 300px, espessura de 5px, cor Azul-escuro.
Exercício 17-E:
Salvar como EXE17E.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da 2ª Página da Direita:
• Título no Navegador = Exercício 17-E - 2ª Página da Direita do Frame.
• Cor do fundo = #EEEEFF
• Cor dos textos = Verde-escuro
� Inserir tabela com 1 linha e 2 células: Comprimento de 100% da tela, sem bordas, espaço interno das células = 0px e espaço
entre as células = 0px.
• 1ª Célula:
o Comprimento de 30px, alinhamento horizontal à esquerda e alinhamento vertical ao topo.
o Inserir a imagem = ImCanto.gif, comprimento de 50px e altura de 50px.
• 2ª Célula:
o Alinhamento horizontal centralizado.
o Parágrafo com o texto “Esta é a 2ª Página da Direita”, fonte arial, 4.
o Linha Horizontal, comprimento de 300px, espessura de 5px, cor Verde-escuro.
o Texto “17E”, fonte arial, 7, itálico e negrito.
o Linha Horizontal, comprimento de 300px, espessura de 5px, cor Verde-escuro.
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 19
� Abaixo seguem os códigos-fontes:
<HTML>
<!---- EXERCÍCIO 17-A - PROF. CELSO GALLÃO ---->
<!---- PÁGINA PRINCIPAL DOS FRAMES ---->
<HEAD>
<TITLE>Exercício 17 - Página Principal</TITLE>
</HEAD>
<FRAMESET ROWS="100,*" FRAMEBORDER="0" FRAMESPACING="0">
<FRAME NAME="FrameAlto" SRC="Exe17b.htm" SCROLLING="no" NORESIZE MARGINHEIGHT="3"
MARGINWIDTH="3">
<FRAMESET COLS="150,*">
<FRAME NAME="FrameEsquerda" SRC="Exe17c.htm" SCROLLING NORESIZE>
<FRAME NAME="FrameDireita" SRC="Exe17d.htm" SCROLLING="yes" NORESIZE
MARGINHEIGHT="0" MARGINWIDTH="0">
</FRAMESET>
</FRAMESET>
<NOFRAMES>
<BODY BGCOLOR="red" TEXT="yellow">
<CENTER><B>
O seu Navegador não suporta FRAMES, esta página não pode ser mostrada!
</B></CENTER>
</BODY>
</NOFRAMES>
</HTML>
<HTML>
<!---- EXERCÍCIO 17-B - PROF. CELSO GALLÃO ---->
<!---- PÁGINA DO ALTO DO FRAME ---->
<HEAD>
<TITLE>Exercício 17-B - Página para o Frame do Alto</TITLE>
</HEAD>
<BODY BGCOLOR="#AADDEE" TEXT="darkblue" LINK="browm" VLINK="white" ALINK="silver">
<TABLE BORDER="0" WIDTH="100%" CELLSPACING="0">
<TR BGCOLOR="lightblue" HEIGHT="50">
<TD WIDTH="110">
<IMG SRC="LgSing.gif" HEIGHT="48"></TD>
<TH ALIGN="right">
<FONT FACE="Verdana" SIZE="4">
Exercício 17 - Frames Aninhados
</FONT></TD></TR>
<TR BGCOLOR="red" HEIGHT="30">
<TH COLSPAN="2">
<FONT FACE="Arial" SIZE="5" COLOR="#FFFF00">
Aluno 1, Nº - Aluno 2, Nº
</FONT></TD></TR>
</TABLE>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 20
<HTML>
<!---- EXERCÍCIO 17-C - PROF. CELSO GALLÃO ---->
<!---- PÁGINA DA ESQUERDA DO FRAME ---->
<HEAD>
<TITLE>Exercício 17-C - Página da Esquerda do Frame</TITLE>
<BASE TARGET = "FrameDireita">
</HEAD>
<BODY BGCOLOR="#AADDEE" TEXT="darkblue" LINK="browm" VLINK="white" ALINK="silver">
<CENTER>
<A HREF="Exe17d.htm">
<IMG SRC="BTexe17D.jpg" WIDTH="130" BORDER="0" ALT="Abrir Página 17-D"></A></P>
<A HREF="Exe17e.htm">
<IMG SRC="BTexe17E.jpg" WIDTH="130" BORDER="0" ALT="Abrir Página 17-E"></A></P>
</CENTER>
</BODY>
</HTML>
<HTML>
<!---- EXERCÍCIO 17-D - PROF. CELSO GALLÃO ---->
<!---- 1ª PÁGINA DA DIREITA DO FRAME ---->
<HEAD>
<TITLE>Exercício 17-D - 1ª Página da Direita do Frame</TITLE>
</HEAD>
<BODY BGCOLOR="#EEEEFF" TEXT="darkblue">
<TABLE BORDER="0" WIDTH="100%" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD WIDTH="30" VALIGN="top" ALIGN="left">
<IMG SRC="ImCanto.GIF" WIDTH="50" HEIGHT="50"></TD>
<TD ALIGN="center">
<FONT FACE="Arial" SIZE="4">
<P>Esta é a 1ª Página da Direita
<HR WIDTH="300" SIZE="5" COLOR="darkblue">
<FONT FACE="Arial" SIZE="7"><I><B>17D</B></I>
<HR WIDTH="300" SIZE="5" COLOR="darkblue">
</FONT></TD></TR>
</TABLE>
</BODY>
</HTML>
<HTML>
<!---- EXERCÍCIO 17-E - PROF. CELSO GALLÃO ---->
<!---- 2ª PÁGINA DA DIREITA DO FRAME ---->
<HEAD>
<TITLE>Exercício 17-E - 2ª Página da Direita do Frame</TITLE>
</HEAD>
<BODY BGCOLOR="#EEEEFF" TEXT="darkgreen">
<TABLE BORDER="0" WIDTH="100%" CELLSPACING="0" CELLPADDING="0">
<TR>
<TD WIDTH="30" VALIGN="top" ALIGN="left">
<IMG SRC="ImCanto.GIF" WIDTH="50" HEIGHT="50"></TD>
<TD ALIGN="center">
<FONT FACE="Arial" SIZE="4">
<P>Esta é a 2ª Página da Direita
<HR WIDTH="300" SIZE="5" COLOR="darkgreen">
<FONT FACE="Arial" SIZE="7"><I><B>17E</B></I>
<HR WIDTH="300" SIZE="5" COLOR="darkgreen">
</FONT></TD></TR>
</TABLE>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 21
Exercício 18: Salvar como EXE18.htm. Editar conforme as orientações e Lay-Out abaixo:
� Configuração da Página Principal:
• Título no Navegador = Exercício 18 - Formulário
• Cor do fundo = Verde-Escuro
• Cor dos textos= Verde-Claro
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 18 - Formulário - Microsoft Internet Explorer
Exercício 18 - Formulário de Pesquisa (fonte arial, 4, centralizado)
Aluno 01 – Aluno 02 (fonte arial, 4, centralizado)
Dados Pessoais (ALT+P) (cor amarelo)
Nome: Senha:
(tamanho de 30 caracteres, digitação máxima de 50 caracteres) (tamanho de 6 caracteres, digitação máxima de 6 caracteres)
Sexo: Masculino (default) Feminino
Cidade: (Lista Suspensa com 7 opções, sendo exibida apenas 4 de cada vez.)
Santo André
(default)
São Bernardo do Campo
São Caetano do Sul
Diadema
Mauá
Ribeirão Pires
Outra
Disciplinas que mais gosto (ALT+G) (cor amarelo)
(Tabela com 2 colunas, sem bordas.)
Linguagem Gráfica de Programação
Técnicas de Computação Gráfica (default)
Fundamentos da Informática
Técnicas Operacionais
Técnicas de Programação
Arquitetura de Equipamentos
Fale sobre o(a) professor(a) que mais ama (ALT+F): (cor amarelo)
(Tabela com 2 colunas, sem bordas.)
(Área para digitação de texto, com 5 linhas e 40 colunas)
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 22
<HTML><!---- EXERCÍCIO 18 - PROF. CELSO GALLÃO ---->
<HEAD>
<TITLE>Exercício 18 - Formulário</TITLE>
</HEAD>
<BODY BGCOLOR="darkgreen" TEXT="lightgreen">
<CENTER>
<FONT FACE="arial" SIZE="4">
<B>Exercício 18 - Formulário de Pesquisa<BR>Aluno 1 - Aluno 2</B></FONT>
</CENTER>
<!---- Criação do Formulário ---->
<FORM NAME="F1">
<FIELDSET>
<LEGEND ACCESSKEY="P">
<FONT COLOR="yellow">Dados Pessoais (ALT + P)</FONT>
</LEGEND>
Nome: <INPUT TYPE="text" NAME="txt1" VALUE="" SIZE="30" MAXLENGTH="50">
Senha: <INPUT TYPE="password" NAME="psw1" VALUE="" SIZE="6" MAXLENGTH="6"><P>
Sexo: <INPUT TYPE="radio" NAME="rd1" VALUE="M" CHECKED>Masculino
<INPUT TYPE="radio" NAME="rd1" VALUE="F">Feminino<P>
Cidade: <BR>
<SELECT NAME="lista1" SIZE="4">
<OPTION SELECTED>Santo André</OPTION>
<OPTION>São Bernardo</OPTION>
<OPTION>São Caetano</OPTION>
<OPTION>Diadema</OPTION>
<OPTION>Mauá</OPTION>
<OPTION>Ribeirão Pires</OPTION>
<OPTION>Outra</OPTION>
</SELECT>
</FIELDSET>
<P>
<FIELDSET>
<LEGEND ACCESSKEY="G">
<FONT COLOR="yellow">Disciplinas que mais gosto (ALT + G)</FONT>
</LEGEND>
<TABLE WIDTH="100%" BORDER="0">
<TR>
<TD>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="LGP">
Linguagem Gráfica de Programação<BR>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="TCG" CHECKED>
Técnicas de Computação Gráfica<BR>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="FI">
Fundamentos da Informática</TD>
<TD>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="TO">
Técnicas Operacionais<BR>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="TP">
Técnicas de Programação<BR>
<INPUT TYPE="checkbox" NAME="cx1" VALUE="AE">
Arquitetura de Equipamentos</TD></TR>
</TABLE>
</FIELDSET>
<P>
<FIELDSET>
<LEGEND ACCESSKEY="F">
<FONT COLOR="yellow">
Fale sobre o(a) professor(a) que mais ama (ALT + F)
</FONT>
</LEGEND>
<TABLE WIDTH="100%" BORDER="0">
<TR>
<TD>
<TEXTAREA NAME="area1" COLS="40" ROWS="5"></TEXTAREA></TD>
<TD>
<INPUT TYPE="reset" NAME="bt2" VALUE="LIMPAR"><P>
<INPUT TYPE="submit" NAME="bt1" VALUE="ENVIAR"></TD></TR>
</TABLE>
</FIELDSET>
</BODY></HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 23
Exercício 19:
Editar e salvar com o nome de EXE19.htm:
� Configuração da Página Principal:
• Título no Navegador = Exercício 19 - Formulário
� Definindo estilos na própria página:
• BODY {fonte arial, 10, cor da fonte verde, cor do fundo verde-claro};
• H1 {fonte arial, 20, negrito, cor marrom};
• H2 {fonte arial, 15, negrito, cor azul-escuro};
• H3 {fonte arial, 12, negrito, cor verde-escuro};
• TABLE {cor do fundo vermelho-escuro};
• TD {fonte verdana, 12, cor branca, texto alinhado à esquerda};
• HR {cor vermelha, espessura de 5pt};
• FIELDSET {cor verde-escuro, borda sólida, expessura de 5px};
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 19 - Formulário - Microsoft Internet Explorer
Exercício 19 - Formulário com Folha de Estilo
Aluno 01 – Aluno 02
Dados cadastrais (ALT+D)
Nome: Senha:
(tamanho de 30 caracteres, digitação máxima de 50 caracteres) (tamanho de 6 caracteres, digitação máxima de 6 caracteres)
Sexo: Masculino (default) Feminino
Eletrodomésticos que possui em casa (ALT+E)
� TV (CRT) � TV (Plasma)
� Microcomputador � Freezer
� Chuveiro Elétrico (default � Microondas
O Consumo Mensal Total é de (ALT+M)
(Lista Suspensa com 4 opções, sendo exibida apenas 4 de cada vez, centralizado.)
até 100Kwh
de 100 a 200 Kwh(deverá estar pré-selecionada)
de 200 a 500 Kwh
acima de 500Kwh
Fale sobre o apagão: (ALT+A)
(Tabela com 2 colunas, sem bordas.)
(Área para digitação de texto, com 5 linhas e 40 colunas)
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 24
<HTML>
<!---- EXERCÍCIO 19 Versão 2006 - HTML - PROF. CELSO GALLÃO ---->
<HEAD>
<TITLE>Exercício 19 - Formulário</TITLE>
<!---- Definindo Estilos ---->
<STYLE>
<!--
BODY {font: 10pt "arial"; color:"green"; background: "lightgreen"};
H1 {font: 20pt "arial"; font-weight: "bold"; color:"brown"};
H2 {font: 15pt "arial"; font-weight: "bold"; color:"darkblue"};
H3 {font: 12pt "arial"; font-weight: "bold"; color:"darkgreen"};
TABLE {background: "darkred"};
TD {font: 12pt "verdana"; color: "white"; text-align: "left"};
HR {color: "red"; line-height: 5pt};
FIELDSET{color: "darkgreen"; border: "solid"; border-width: 5px };
-->
</STYLE>
</HEAD>
<BODY>
<CENTER>
<H1>Exercício 19 - Formulário com Folha de Estilo</H1>
<H2>Aluno 1 - Aluno 2</H2>
<HR>
</CENTER>
<FORM NAME="F1">
<!---- 1º Fieldset ---->
<FIELDSET>
<LEGEND ACCESSKEY="P">
<H3>Dados Pessoais (ALT + P)</H3>
</LEGEND>
Nome...: <INPUT TYPE="text" NAME="txt1" VALUE="" SIZE="30" MAXLENGTH="50">
Senha..: <INPUT TYPE="password" NAME="psw1" VALUE="" SIZE="6" MAXLENGTH="6"><P>
Sexo: <INPUT TYPE="radio" NAME="rd1" VALUE="M" CHECKED>Masculino
<INPUT TYPE="radio" NAME="rd1" VALUE="F">Feminino
</FIELDSET>
<P><!---- 2º Fieldset ---->
<FIELDSET>
<LEGEND ACCESSKEY="E">
<H3>Eletrodomésticos que possui em casa (ALT+E)</H3>
</LEGEND>
<TABLE WIDTH="100%" BORDER="0">
<TR>
<TD>
<INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="TC">TV (CRT)<BR>
<INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="MC">Microcomputador<BR>
<INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="CE" CHECKED>Chuveiro Elétrico</TD>
<TD>
<INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="TP">TV (Plasma)<BR><INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="FR">Freezer<BR>
<INPUT TYPE="CHECKBOX" NAME="cx1" VALUE="MO">Microondas</TD></TR>
</TABLE>
</FIELDSET>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 25
<P><!---- 3º Fieldset ---->
<CENTER>
<FIELDSET>
<LEGEND ACCESSKEY="M">
<H3>O Consumo Mensal Total é de (ALT+M)</H3>
</LEGEND>
<SELECT NAME="lista" SIZE="4">
<OPTION>até 100Kwh</OPTION>
<OPTION SELECTED>de 100Kwh a 200Kwh</OPTION>
<OPTION>de 200kwh a 500Kwh</OPTION>
<OPTION>acima de 500Kwh</OPTION>
</SELECT>
</FIELDSET>
</CENTER>
<P><!---- 4º Fieldset ---->
<FIELDSET>
<LEGEND ACCESSKEY="A">
<H3>Fale sobre o apagão: (ALT + A)</H3>
</LEGEND>
<TABLE WIDTH="100%" BORDER="0">
<TR>
<TD>
<TEXTAREA NAME="area1" COLS="40" ROWS="5"></TEXTAREA></TD>
<TD>
<INPUT TYPE="RESET" NAME="bt2" VALUE="LIMPAR"><P>
<INPUT TYPE="SUBMIT" NAME="bt1" VALUE="ENVIAR"></TD></TR>
</TABLE>
</FIELDSET>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 26
Exercício 20:
Editar e salvar com o nome de EXE20A.htm:
� Configuração da Página Principal:
• Título no Navegador = Exercício 20A - Página 1
� Definindo Metainformações:
• Palavras-chave: HTML, Folha de Estilo, Formulário
• Descrição da Página: Exercício 20A, Folha de Estilo
• Atualização da página: Deve ser carregada a página EXE20B.htm, após 5 segundos.
� Definindo estilos na própria página:
• BODY {fonte arial, 10, cor da fonte verde, cor do fundo verde-claro};
• H1 {fonte arial, 20, negrito, cor marrom};
• H2 {fonte arial, 15, negrito, cor azul-escuro};
• FIELDSET {borda estilo grove, espessura de 5px};
• LINK {fonte verdana, 12, verde-escuro, negrito, sem sublinhado};
• LINK EM AÇÃO {fonte verdana, 10, branco, sem sublinhado};
• LINK VISITADO {fonte verdana, 10, laranja, sem sublinhado};
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 20A - Página 1 - Microsoft Internet Explorer
Exercício 20A - Comando Meta e Folha de Estilo (H1)
Página 1 (H3)
Aluno 01 – Aluno 02 (H2)
Portal Singular (ALT+S) (vermelho negrito)
Portal Singular - Anglo (Link para http://www.singular.com.br)
Colégio Singular - Diurno (Link para http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares/ensinomediod.htm)
Colégio Singular - Noturno (Link para http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares/ensinomedion.htm)
Exercício 20 - Continuação: Editar e salvar com o nome de EXE20B.htm:
� Configuração da Página Principal:
• Título no Navegador = Exercício 20B - Sem Estilo - Página 2
� Definindo Metainformações:
• Palavras-chave: HTML, Folha de Estilo, Formulário
• Descrição da Página: Exercício 20B, Folha de Estilo
• Atualização da página: Deve ser carregada a página EXE20A.htm, após 5 segundos.
� Outras configurações de acordo com o Lay-Out abaixo:
Exercício 20B - Página 2 - Microsoft Internet Explorer
Exercício 20B - Sem Estilo - Página 2 (H1)
Aluno 01 – Aluno 02 (H2)
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 27
<HTML>
<!---- EXERCÍCIO 20A Versão 2006 - HTML - PROF. CELSO GALLÃO ---->
<HEAD>
<TITLE>Exercício 20A - Página 1</TITLE>
<!---- Definindo Meta Informações ---->
<META HTTP-EQUIV= "Keywords" CONTENT="HTML, Folha de Estilo, Formulário">
<META HTTP-EQUIV= "Description" CONTENT="Exercício 20A, Folha de Estilo">
<META HTTP-EQUIV= "Refresh" CONTENT="5; URL=Exe20b.htm">
<!---- Definindo estilos na própria página ---->
<STYLE>
<!--
BODY {font: 10pt "arial"; color:"green"; background: "lightgreen"};
H1 {font: 20pt "arial"; font-weight: "bold"; color:"brown"};
H2 {font: 15pt "arial"; font-weight: "bold"; color:"darkblue"};
FIELDSET {border:"grove"; border-width:5px};
A:LINK {font: 12pt "verdana"; color: "darkgreen"; font-weight: "bold"; text-
decoration: "none"};
A:ACTIVE {font: 10pt "verdana"; color: "white"; text-decoration: "none"};
A:VISITED {font: 10pt "verdana"; color: "orange"; text-decoration: "none"};
-->
</STYLE>
</HEAD>
<BODY TEXT="darkgreen"><CENTER>
<H1>Exercício 20A - Comando Meta e Folha de Estilo</H1>
<H3>Página 1</H3>
<H2>Aluno 1 - Aluno 2</H2></CENTER>
<FORM NAME="F1">
<FIELDSET>
<LEGEND ACCESSKEY="S">
<FONT COLOR="red"><B>Portal Singular (ALT + S)<B></FONT>
</LEGEND>
<P>
<A HREF="http://www.singular.com.br">
Portal Singular - Anglo</A><P>
<A HREF="http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares
/ensinomediod.htm">Colégio Singular - Diurno</A><P>
<A HREF="http://paginas.terra.com.br/educacao/portaisls/singular/principal/regulares
/ensinomedion.htm">Colégio Singular - Noturno</A><P>
</FIELDSET>
</FORM>
</BODY>
</HTML>
<HTML>
<!---- EXERCÍCIO 20B Versão 2006 - HTML - PROF. CELSO GALLÃO ---->
<HEAD>
<TITLE>Exercício 20B - Página 2</TITLE>
<!---- Definindo Meta Informações ---->
<META HTTP-EQUIV= "Keywords" CONTENT="HTML, Folha de Estilo, Formulário">
<META HTTP-EQUIV= "Description" CONTENT="Exercício 20b, Folha de Estilo">
<META HTTP-EQUIV= "Refresh" CONTENT="5; URL=Exe20A.htm">
</HEAD>
<BODY TEXT="darkgreen" BGCOLOR="yellow">
<CENTER>
<H1>Exercício 20B - Sem Estilo - Página 2</H1>
<H2>Aluno 1 - Aluno 2</H2>
</CENTER>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 28
Exercício 21:
Editar e salvar com o nome de EXE21.htm:
� Configuração da Página Principal:
• Título no Navegador = Exercício 21
� Definindo Metainformações:
• Palavras-chave: HTML, Folha de Estilo, Formulário
• Descrição da Página: Exercício 21, Folha de Estilo Externa
� Definindo Estilo com Arquivo Externo:
• Carregar arquivo de estilo chamado Exe21.css
� Outras configurações de acordo com o Lay-Out abaixo:
• Texto em H1, centralizado: Exercício 21 - Folha de Estilo Externa
• Texto em H2, centralizado: Aluno 01 – Aluno 02
• Linha Horizontal
• FIELDSET com a legenda com texto em H3 Exercícios Anteriores (ALT + E), e tecla de atalho ALT+E.
o Cinco LINKS, sendo um em cada linha, com acesso aos exercícios 16, 17, 18, 19 e 20.
• Quebra de Parágrafo.
• FIELDSET com a legenda com texto em H3 Configurando Tabelas (ALT + T), e tecla de atalho ALT+T.
o Tabela de 1 linha com 2 colunas, sem bordas. A linha deverá ter 50px de altura.
o A 1ª Célula terá o texto Estou adorando as folhas de estilo! com alinhamento vertical para baixo.
o A 2ª Célula terá o texto Vou detonar nas próximas páginas! com alinhamento vertical para cima.
• Quebra de Parágrafo (retirar estilo pré-formatado).
• Texto em H3, centralizado: Formatando Parágrafos.
• Texto em Parágrafo: Testando a formatação de um parágrafo.
• Quebra de linha.
• Texto em Parágrafo: E ai, você gostou?
Exercício 21 - Microsoft Internet Explorer
Exercício 21 - Folha de Estilo Externa
(H1)
Aluno 01 – Aluno 02 (H2)
Exercícios Anteriores (ALT + E)
Exercício 16 (Link para Exe16a.htm)
Exercício 17 (Link para Exe17a.htm)
Exercício 18 (Link para Exe18.htm)
Exercício 19 (Link para Exe19.htm)
Exercício 20 (Link para Exe20a.htm)Configurando Tabelas (ALT + T)
Estou adorando as folhas de estilo!
Vou detonar nas próximas páginas!
Formatando Parágrafos
Testando a formatação de um parágrafo.
E ai, você gostou?
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 29
<HTML>
<!---- EXERCÍCIO 21 Versão 2006 - HTML - PROF. CELSO GALLÃO ---->
<HEAD>
<TITLE>Exercício 21</TITLE>
<!---- Definindo Meta Informações ---->
<META HTTP-EQUIV= "Keywords" CONTENT="HTML, Folha de Estilo, Formulário">
<META HTTP-EQUIV= "Description" CONTENT="Exercício 21, Folha de Estilo Externa">
<!---- Acessando Arquivo Externo de Folha de Estilos ---->
<LINK REL="StyleSheet" HREF="Exe21.css" TYPE="text/css">
</HEAD>
<BODY>
<H1>Exercício 21 - Folha de Estilos Externa</H1>
<H2>Aluno 1 - Aluno 2</H2>
<HR>
<FORM NAME="Form1">
<FIELDSET>
<LEGEND ACCESSKEY="E">
<H3>Exercícios Anteriores (ALT + E)</H3>
</LEGEND>
<CENTER>
<A HREF="exe16a.htm">Exercício 16</A><BR>
<A HREF="exe17a.htm">Exercício 17</A><BR>
<A HREF="exe18.htm" >Exercício 18</A><BR>
<A HREF="exe19.htm" >Exercício 19</A><BR>
<A HREF="exe20a.htm">Exercício 20</A>
</CENTER>
</FIELDSET>
<P>
<FIELDSET>
<LEGEND ACCESSKEY="T">
<H3>Configurando Tabelas (ALT + T)</H3>
</LEGEND>
<TABLE WIDTH="100%" BORDER="0">
<TR HEIGHT="50">
<TD VALIGN="bottom" >Estou adorando as folhas de estilo!</TD>
<TD VALIGN="top">Vou detonar nas próximas páginas!</TD>
</TR>
</TABLE>
</FIELDSET>
</FORM>
<!---- Retirando o estilo pré-formatado ---->
<P style=border: "none">
<H3 align="center">Formatando Parágrafos</H3>
<P>Testando a formatação de um parágrafo.<BR>E ai, você gostou?</P>
</BODY>
</HTML>
Colégio Singular – Caderno de Exercício das Aulas de HTML - Prof. Celso Gallão – Atualização: Prof. Aislan Ramos Página 30
Exercício 21 - Continuação:
Editar e salvar com o nome de EXE21.css:
� Definindo estilos no Arquivo Externo:
• BODY {carregar figura LgSing.gif sem repetição, fixa na margem direita e centro da tela. Margem superior de 0px e
cor da barra de rolagem em verde-claro};
• H1 {fontes script ou arial, 30, negrito, cor #303030, alinhamento à direita};
• H2 {fonte arial, 16, negrito, cor #505050, alinhamento ao centro};
• H3 {fonte arial black, 10, itálico, cor vermelha};
• FIELDSET {borda estilo sólido, espessura de 5px, cor vermelha};
• LINK {fonte verdana, 10, cor rgb(50%,50%,10%), negrito, sem sublinhado};
• LINK EM AÇÃO {fonte verdana, 10, cor-de-rosa, sem sublinhado};
• LINK VISITADO {fonte verdana, 10, cor-de-laranja, sem sublinhado};
• TABLE {cor do fundo amarela};
• TD {fonte verdana, 12, vermelha, alinhamento ao centro};
• HR {cor vermelha, espessura de 5pt};
• P {cor do fundo verde-escuro, fontes script ou arial, 20, branca, com borda dupla de 10px de espessura};
<!---- EXERCÍCIO 21 FOLHA DE ESTILO EXTERNA - Versão 2006 - HTML - PROF. CELSO GALLÃO ---->
<style>
<!--
BODY {background: URL(LgSing.gif) right center no-repeat fixed; margin-top: 0px;
scrollbar-base-color: lightgreen};
H1 {font-family: "script,arial"; font-size: 30pt; font-weight: "bold";
color:"rgb(30,30,30)"; text-align: "right"};
H2 {font: 16pt "arial"; font-weight: "bold"; color:"#505050"; text-align:
"center"};
H3 {font: 10pt "arial black"; font-style: "italic"; color: "red"};
A:LINK {font: 10pt "verdana"; color: "rgb(50%,50%,10%)"; font-weight: "bold"; text-
decoration: "none"};
A:ACTIVE {font: 10pt "verdana"; color: "pink"; text-decoration: "none"};
A:VISITED {font: 10pt "verdana"; color: "orange"; text-decoration: "none"};
TABLE {background: "yellow"};
TD {font: 12pt "verdana"; color: "red"; text-align: "center"};
HR {color: "red"; line-height: 5pt};
P {background: "darkgreen"; font-family: "script,arial"; font-size: 20pt; color:
"white"; border: "double"; border-width: 10px };
FIELDSET {color: "red"; border: "solid"; border-width: 5px };
-->
</style>Materiais relacionados
Perguntas relacionadas
Compartilhar