Os Formulários em HTML são usados para selecionar diferentes tipos de entradas do usuário.

Formulários

Um formulário é uma área que pode conter elementos de formulário.

Os elementos de formulário são elementos que permitem o usuário entrar informação (como campos de texto, campos de área de texto, menus drop-down, botões radiais, caixas de seleção, etc.) em um formulário.

Um formulário é definido pela tag <form>.

<form>
  <input>
  <input>
</form>

Entrada (Input)

A tag de formulário mais usada é a tag <input>. O tipo de input é especificado com o atributo type (tipo). Os tipos de input mais cumumente usados são explicados abaixo.

Campos de Texto

Os campos de texto são usados quando você quer que o usuário digite letras, números, etc. em um formulário.

<form>
Primeiro nome: 
<input type="text" name="firstname">
<br>
Último nome: 
<input type="text" name="lastname">
</form>

Como aparece no navegador:

Observe que o formulário propriamente não está visivel. Também observe que em muitos navegadores, o comprimento do campo de texto é de 20 caracteres por padrão (default).

Botões Radiais

Botões Radiais são usados quando você quer que o usuário selecione uma entre uma quantidade limitada de escolhas.

<form>
<input type="radio" name="sex" value="male"> Masculino
<br>
<input type="radio" name="sex" value="female"> Feminino
</form>

Como aparece no navegador:

Observe que somente uma opção pode ser escolhida.

Caixas de Seleção

As Caixas de Seleção são usadas quando você quer que o usuário selecione uma ou mais opções de uma quantidade limitada de escolhas.

<form>
<input type="checkbox" name="bike">
Eu tenho uma bicicleta
<br>
<input type="checkbox" name="car">
Eu tenho um carro
</form>

Como aparece no navegador:

O Atributo Ação do Formulário (Form’s Action) e o Botão Enviar (Submit)

Quando o usuário clica no botão “Enviar”, o conteúdo do formulário é enviado para outro arquivo. O atributo de ação do formulário define o nome do arquivo para o qual enviar o conteúdo. O arquivo definido no atributo action geralmente faz algo com a entrada recebida.

<form name="input" action="html_form_action.asp"
method="get">
Nome do Usuário: 
<input type="text" name="user">
<input type="submit" value="Enviar">
</form>

Como aparece no navegador:

Se você digitar alguns caracteres no campo de texto acima, e clicar no botão Enviar”, você irá enviar a sua entrada para a página chamada “html_form_action.asp”. Esta página irá mostrar-lhe a entrada recebida.

Tags de Formulário