Buscar

ConstruÃÃo de FormulÃrios

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

Você também pode ser Premium ajudando estudantes

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

Você também pode ser Premium ajudando estudantes

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

Você também pode ser Premium ajudando estudantes
Você viu 3, do total de 7 páginas

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

Você também pode ser Premium ajudando estudantes

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

Você também pode ser Premium ajudando estudantes

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

Você também pode ser Premium ajudando estudantes
Você viu 6, do total de 7 páginas

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

Você também pode ser Premium ajudando estudantes

Prévia do material em texto

Construção de Formulários 
 
Iniciaremos nossa atividade fazendo uma revisão sobre formulários. 
É importante lembrar que antes de iniciarmos vamos criar um projeto com o nome Revisão. 
Assim, anote os passos para criação de um projeto, você vai precisar: 
1 – Inicialize o xampp e start o botão do Apache 
2 – Inicialize o NetBeans 
3 – clique em Arquivo (file) -> Novo Projeto (new Project) -> escolha PHP 
 
 
 
4- Escolha PHP -> PHP -> clique em próximo (next): 
 
 
 5- Coloque o nome do projeto no campo em destaque (RevisaoSegundoSemestre) e clique em 
finalizar (finish): 
• Atenção nos de projetos, páginas e variáveis não podem conter caracteres especiais (~, 
^, ´, `, ç), nem espaços em branco, por isso o nome ‘RevisaoSegundoSemestre’ sem 
acento e sem espaço em branco. 
 
 
6- O Netbeans criará um projeto com o nome RevisaoSegundoSemestre, dentro deste projeto, 
por padrão ele cria uma página com o nome index. Php 
Essa página já tem a estrutura básica de uma página em HTML, com espaço definido para 
programação em PHP, vejamos: 
 
 
 Este é o projeto. 
 Ele está gravado no C:\xampp\htdocs. 
 
 
 
 
Página padrão do html criada pelo Netbeans. 
<!DOCTYPE html> - Indica para o navegador que tipo de página será inicializado 
<!-- 
To change this license header, choose License Headers in Project Properties. Comentário em html
 
To change this template file, choose Tools | Templates 
and open the template in the editor. 
--> 
 <html> 
 <head> 
 <meta charset="UTF-8"> Cabeçalho 
 <title></title> 
 </head> 
 <body> 
 <?php 
 // put your code here Corpo, onde iremos criar a página 
 ?> 
 </body> 
 </html> 
 
A – <html> </html> – Início e fim da página html. 
B – <head> </head>– Início e fim do cabeçalho, onde são feitas as configurações da página. 
C - <body></body> - Corpo, onde será construída a página 
D - <?php 
 Programação em php 
 ?> 
 
 
 
Revisão 
 
Vamos usar algumas tags para montar um formulário, que é um objeto do HTML que nos 
permite interagir com o usuário, disponibilizando campos onde o usuário pode fornecer 
informações que serão recebidas e tratadas pela página. 
Dentro do corpo do HTML – vamos criar um formulário 
A - Dá um enter depois de <body>, pois vamos trabalhar no HTML 
 
 
B – Ao digitar a tag <form> aparece o fechamento da tag, basta dá enter e vai ficar assim: 
 
 
 
 
 
 
 
 
 
 
 
 
Assista o vídeo disponibilizado no link a seguir e monte o formulário apresentado abaixo: 
 
 
 
O link da aula está na sala virtual, são 6 vídeos, bem pequenos que vão ajudar você a montar o 
formulário. 
Depois de montar o formulário do auxílio emergencial, faça a atividade avaliativa disponível na 
aula 3. 
 
 
Resumo das principais Tags 
 
Tag Descrição 
--> Define um comentário 
<!DOCTYPE> Define o tipo de documento; 
<a> Define um hyperlink 
<abbr> Define uma abreviação 
<address> Define um endereço. 
<area> Define uma área dentro de um mapa de imagem 
<b> Define um texto em negrito; 
<base> Define uma base URL para todos os links da página 
<bdo> Define uma base URL para todos os links da página 
<blockquote> Define uma citação longa 
<body> Define o corpo da página 
<br> Insere uma quebra de linha simples 
<button> Define um botão de comando; 
<caption> Define o "caption" de uma tabela; 
<cite> Define uma citação; 
<code> Define o código texto do computador; 
<col> Define os atributos da coluna da tabela; 
<colgroup> Define um grupo de colunas da tabela; 
<dd> Define uma descrição de definição; 
<del> Define um texto deletado; 
<dfn> Define um termo de definição; 
<div> Define uma seção no documento; 
<dl> Define uma lista de definição; 
<dt> Define um termo de definição; 
<em> Define um texto em ênfase; 
<fieldset> Define um conjunto de campos (fieldset); 
<form> Define um formulário; 
<h1> até <h6> Define do cabeçalho 1 até o cabeçalho 6; 
<head> Define uma informação sobre o documento. (Não aceita 
mais elementos Child como filho); 
<hr> Define uma regra horizontal. (Tem o mesmo nível que um 
parágrafo, mas também é utilizado para fazer separações e 
quebras de linha); 
<html> Define um documento html; 
<i> Define um texto em itálico; (Possui o mesmo nível 
semântico que um SPAN. O texto continua sendo itálico e 
para usuários de leitores de tela, a voz utilizada é modificada 
para indicar ênfase. É de grande valor e utilidade para 
marcar, termos técnicos, termos em outras linguagens etc.) 
<iframe> Define uma linhas sobre a janela (frame); 
<img> Define uma imagem; 
<input> Define um campo de inserção; 
<ins> Define um texto inserido; 
<kbd> Define um texto do teclado; 
<label> Define uma "label" para o formulário; 
<legend> Define um título para os campos (fields); 
<li> Define os itens da lista; 
<link> Define uma referência; 
<map> Define uma imagem de mapa; 
<menu> Define uma lista de "menus"; 
<meta> Define informações meta; 
<noscript> Define uma seção noscript; 
<object> Define um objeto incorporado; 
<ol> Define uma lista ordenada; 
<optgroup> Define um grupo de opção; 
<option> Define uma opção em uma lista suspensa (drop-down list); 
<p> Define um parágrafo; 
<param> Define um parâmetro para determinado objeto; 
<pre> Define um texto pré-formatado; 
<q> Define uma citação curta; 
<s> Define um texto que não é mais correto. 
<samp> Define um código de amostra; 
<script> Define um script; 
<select> Define uma lista selecionável; 
<small> Define um pequeno texto; 
<span> Define uma seção no documento; 
<strong> Define um texto forte (similar ao negrito); 
<style> Define um estilo; 
<sub> Define um texto subscrito; 
<sup> Define um texto sobrescrito; 
<table> Define uma tabela; 
<tbody> Define o corpo da tabela; 
<td> Define uma célula da tabela; 
<textarea> Define um área de texto; 
<tfoot> Define o rodapé da tabela; 
<th> Define o cabeçalho da tabela; 
<thead> Define o cabeçalho da tabela; 
<title> Define o título do documento; 
<tr> Define uma linha da tabela; 
<ul> Define uma lista desordenada; 
<var> Define uma variável;

Outros materiais