Início » Tutoriais » Tutorial HTML

Formulários HTML

Formulários HTML são usados ​​para selecionar diferentes tipos de entrada do usuário.

Formulários HTML

Formulários HTML são usados ​​para transmitir dados para um servidor.

Um formulário HTML pode conter elementos input, como campos de texto, caixas de seleção, botões de rádio, apresentar botões e mais. Um formulário também pode conter listas de seleção, text area, fieldset, legenda, e elementos de rotulagem.

A tag <form> é usado para criar um formulário HTML:

<form>
.
elementos do formulário
.
</form>

Formulários HTML - o elemento input

O elemento mais importante forma é o elemento <input>.

O elemento <input> é usado para selecionar as informações do usuário.

Um elemento <input> pode variar de muitas formas, dependendo do tipo de atributo. Um elemento <input> pode ser de tipo de campo de texto, caixa de seleção, botão de opção de senha, botão enviar, e muito mais.

Os tipos mais comuns de entrada encontram-se descritos abaixo.

<form>
Nome: <input type="text" name="firstname"><br>
Sobrenome: <input type="text" name="lastname">
</form>

Como o código HTML acima aparece no navegador:

Nome:
Sobrenome:  

Nota: A forma em si não é visível. Observe também que a largura padrão de um campo de texto é de 20 caracteres. 


Campo de senha

<input type="password"> define um campo de senha:

<form>
Senha: <input type="password" name="pwd">
</form>

Como o código HTML acima aparece no navegador:

Senha:  

Botões de Rádio

<input type="radio"> define um botão de rádio. Os botões de rádio permitem que um usuário selecionar apenas um de um número limitado de opções:

<form>
<input type="radio" name="sexo" value="masculino">Masculino<br>
<input type="radio" name="sexo" value="feminino">Feminino
</form>

Como o código HTML acima aparece no navegador:

Masculino
Feminino

As caixas de seleção

<input type="checkbox"> define uma caixa de seleção. Caixas de verificação permitem que um usuário selecionar zero ou mais opções de um número limitado de opções.

<form>
    <input type="checkbox" name="veiculo" value="moto">Eu tenho uma moto<br>
    <input type="checkbox" name="veiculo" value="carro">Eu tenho um carro 
</form>

Como o código HTML acima aparece no navegador:

 

Eu tenho uma moto
Eu tenho um carro

Botão de envio

<input type="submit"> define um botão de envio.

Um botão enviar é usado para enviar os dados do formulário para um servidor. Os dados são enviados para a página especificada no atributo action do formulário. O arquivo definido no atributo action geralmente faz algo com a entrada recebida:

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

Como o código HTML acima aparece no navegador:

Usuário:  

Se você digitar alguns caracteres no campo de texto acima, e clique no botão "Enviar", o navegador irá enviar o seu contributo para uma página chamada "demo_form_action.asp". A página irá mostrar-lhe a entrada recebida.


Formulário de tags HTML

= Tag adicionada no HTML5.

Tag Descrição
<form> Define um formulário HTML para preenchimento
<input> Define um controle de entrada
<textarea> Define um controle de entrada multilinha
<label> Define um rótulo para um elemento <input>
<fieldset> Define grupos elementos relacionados em um formulário
<legend> Define uma legenda para um elemento <fieldset>
<select> Define uma lista drop-down
<optgroup> Define um grupo de opções relacionadas em uma lista drop-down
<option> Define uma opção em uma lista drop-down
<button> Define um botão clicável
<datalist> Define uma lista de opções pré-definidas para controles de entrada
<keygen> Define um campo gerador de par de chaves (para formulários)
<output> Define o resultado de uma entrada

Em caso de dúvida, você pode tirar nos comentários.

Categoria: Tutorial HTML | Adicionado por : ShZlot (16-07-2014)
Visualizações: 783 | Ranking: 0.0/0
Total de comentários: 0
avatar