A maior rede de estudos do Brasil

Grátis
55 pág.
Apostila HTML

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

anterior 
por <OPTION selected>Outono</OPTION>, o resultado será: 
 
Outono
 
4.3.2 BOTÕES DE RADIO 
Existe outra alternativa para expor uma escolha, neste caso, obrigamos ao internauta a 
escolher unicamente uma das opções que lhe propõem. A etiqueta empregada neste caso é 
<INPUT> na qual teremos a atributo type que temos de tomar o valor radio. Vejamos um 
exemplo: 
 
<INPUT type=radio name=estação value=1>Primavera <BR> 
<INPUT type=radio name=estação value=2>Verão <BR> 
<INPUT type=radio name=estação value=3>Outono <BR> 
<INPUT type=radio name=estação value=4>Inverno <BR> 
 
O resultado é o seguinte: 
 
Primavera 
Verão 
Outono 
Inverno 
Como podemos ver, a cada uma das opções se atribui uma etiqueta input dentro da qual 
atribuímos o mesmo nome (name) para todas as opções e um valor (value) distinto. Se o 
usuário escolhe supostamente Outono, receberemos em nosso correio uma linha tal como 
04 – Formulários 
HTML – Lucilia Ribeiro 20
esta: estação=3. Cabe assinalar que é possível pré-selecionar por padrão uma das opções. 
Isto se pode conseguir por meio do atributo checked: 
<INPUT type=radio name=estação value=2 checked>Verão 
Vejamos o efeito: 
 
Primavera 
Verão 
Outono 
Inverno 
4.3.3 CAIXAS DE VALIDAÇÃO 
Estes tipos de elementos podem ser ativados ou desativados pelo visitante com um simples 
clique sobre a caixa em questão. A sintaxe utilizada é muita parecida com as anteriores. A 
única diferença fundamental é o valor adotado pelo atributo type. 
Da mesma forma que para os botões de rádio, podemos ativar a caixa por meio do atributo 
checked. O tipo de informação que chegará ao nosso correio (ou ao programa) será do tipo: 
feijoada=on (ou off dependendo se tiver sido ativada ou não) 
 
<INPUT type=checkbox name=paella>Adoro uma feijoada 
 
Adoro uma feijoada 
 
4.4 BOTÃO SUBMIT, APAGAR CAMPOS E OUTROS 
Os formulários têm de dar lugar não somente à informação a tomar do usuário como 
também, a outra série de funções. Concretamente, permite-nos seu envio mediante seu botão. 
Também pode ser prático poder propor um botão de Apagar Campos ou também, acompanhá-
lo de dados ocultos que possam ajudar-nos em seu processamento. 
4.4.1 BOTÃO ENVIAR CAMPOS 
Para finalizar o processo de preenchimento do formulário e fazê-lo chegar a seu gestor, o 
navegante tem de validá-lo por meio de um botão previsto para tal efeito. A construção de tal 
botão não implica nenhuma dificuldade uma vez familiarizados com as etiquetas input já 
vistas. Como poderemos observar, somente temos de especificar se trata de um botão de 
envio (type=submit) e temos de definir a mensagem do botão por meio do atributo value. 
 
<INPUT type=submit value=Enviar> 
Enviar
 
 
4.4.2 BOTÃO APAGAR CAMPOS 
Este botão nos permitirá apagar o formulário por completo no caso de que o usuário deseje 
refazê-lo desde o princípio. Sua estrutura sintática é igual a anterior. Diferentemente ao botão 
de envio, indispensável em qualquer formulário, o botão de Apagar Campos é meramente 
optativo e não é utilizado freqüentemente. 
 
<INPUT type=reset value=Apagar Campos> 
4.4.3 DADOS OCULTOS 
Em alguns casos, aparte dos próprios dados enviados pelo usuário, pode ser prático enviar 
dados definidos por nós mesmos que ajudem ao programa em seu processamento do 
formulário. Estes tipos de dados, que não se mostram na página, mas que podem ser 
detectados solicitando o código fonte, não são freqüentemente utilizados por páginas 
construídas em HTML, são mais usados por páginas que empregam tecnologias de servidor. 
04 – Formulários 
HTML – Lucilia Ribeiro 21
Esta etiqueta, incluída dentro de nosso formulário, enviará um dado adicional ao correio ou 
ao programa encarregado da gestão do formulário. Poderíamos a partir deste dado, tornar 
conhecido ao programa a origem do formulário ou algum tipo de ação a realizar (um re-
endereçamento, por exemplo). 
 
<INPUT type=hidden name=site value=www.criarweb.com> 
 
EX10HTML 
 
<HTML> 
 <HEAD> 
 <TITLE>EX10</TITLE> 
 </HEAD> 
 <FORM action="mailto:professora@lucilia.com.br" method="post" enctype="text/plain"> 
 Nome <INPUT type="text" name="nome" size="30" maxlength="100"> <P> 
 E-mail <INPUT type="text" name="email" size="25" maxlength="100" value="@"> <P> 
 Cidade <INPUT type="text" name="cidade" size="20" maxlength="60"> <P> 
 Sexo <BR> 
 <INPUT type="radio" name="sexo" value="Masculino" checked> Homem <BR> 
 <INPUT type="radio" name="sexo" value="Feminino"> Mulher 
 <BR> <BR> Frequência das viagens <BR> 
 <SELECT name="utilização"> 
 <OPTION value="1">Várias vezes por dia 
 <OPTION value="2">Uma vez por dia 
 <OPTION value="3">Várias vezes por semana 
 <OPTION value="4">várias vezes por mês 
 </SELECT> 
 <BR> <BR>Comentários sobre sua satisfação pessoal <BR> 
 <TEXTAREA cols="30" rows="7" name="comentários"></TEXTAREA> 
 <BR> <BR> 
 <INPUT type="checkbox" name="receber_info" checked> 
 Desejo receber notificação das novidades nas linhas de ônibus. <BR> <BR> 
 <INPUT type="submit" value="Enviar formulário"> 
 <BR> <BR> 
 <INPUT type="Reset" value="Apagar tudo"> 
 </FORM> 
</HTML> 
 
 
 
05 – Frames 
HTML – Lucilia Ribeiro 22
 
Frames 
 
 
 
"A morte é a libertação total: 
a morte é quando a gente pode, afinal, estar deitado de sapatos". 
(Mário Quintana) 
 
5.1 INTRODUÇÃO 
Os frames são divisões da tela do navegador em diversas telas (ou “quadros”). Com isso, 
torna-se possível apresentar mais de uma página por vez: por exemplo, um índice principal em 
uma parte pequena da tela, e os textos relacionados ao índice em outra parte. O objetivo 
principal é dividir a página em seções que se tornam HTML independentes. 
Não é difícil colocar frames em páginas; porém, nem todos os usuários gostam deles, pois 
nem sempre a navegação é fácil, além de problemas para a impressão e a marcação dos 
documentos interiores aos frames nos bookmarks. 
5.2 DOCUMENTOS DE LAYOUT E DE CONTEÚDO 
Com a definição de frames, os documentos escritos em HTML (extensão html ou htm) 
podem ser de dois tipos: Documentos de Layout e Documentos de Conteúdo. 
Documentos de layout contêm informações sobre a estrutura de frames dos documentos. 
Cada frame declarado em documento de layout contém uma referência implícita ou explícita 
para outro documento que será exibido no frame. Esse "documento filho" será exibido 
independentemente da existência de outros frames na janela do navegador. O "documento 
filho" pode ser um documento de conteúdo ou mesmo outro documento de layout encadeado. 
Os documentos de conteúdo são documentos normais em HTML. Um documento de 
conteúdo pode ser visto em um frame (de um documento de layout) ou sozinho, na janela do 
navegador. A tag <FRAME></FRAME> define o conteúdo de cada frame do documento. 
 
<frame src=pagina.htm name=nome scrolling=no noresize> 
 
SRC:Associa uma URL ao frame. 
NAME: Associa um valor (nome) à janela. 
SCROLLING: Define a presença, ausência ou atribuição automática pelo navegador das 
barras de rolagem. Pode ser yes, no ou auto. 
NORESIZE: Impede que o usuário mude o tamanho do frame. 
A tag <FRAMESET> </FRAMESET> substitui o TAG <BODY> em um documento de 
layout. Ela define a divisão da janela em duas ou mais linhas ou em duas ou mais colunas. 
Pode haver várias TAGs <FRAMESET> encadeados, fazendo-se, desta maneira, divisões das 
divisões da página. 
Contém os elementos FRAME, NOFRAMES e outros FRAMESETs que podem ser aninhados 
para que se tenha uma divisões dentro de uma divisão de layout. 
 
<FRAMESET cols=quant rows=quant frameborder=1|0 framespacing=num> 
 
COLS: Divide a janela (ou frame) em diversos frames verticais, tantos quantos forem os 
valores descritos. Os valores podem estar expressos em pixels, percentuais