Html form

Html form

Neste artigo conheça as tags de um formulário no HTML.

Formulários são algumas das mais partes mais importantes nas paginas da web para juntar informações importantes sobre o usuário da internet. Informações como e-mail, nome, endereço, telefone e qualquer outro tipo de informação.

Tag HTML <form>

Um formulário HTML com três campos de entrada e um botão para enviar:

<form action="enviar.php" method="post">
  
  <label>Nome:</label>
  <input type="text" id="nome" name="nome"><br>
  
  <label>E-mail:</label>
  <input type="text" id="email" name="email"><br><br>

  <label>Mensagem:</label>
  <textarea id="mensagem" name="mensagem"></textarea><br><br>
  
  <input type="submit" value="Enviar">

</form>

Veja mais Definição e Uso das tags de formulário

A form tag é usada para criar um formulário HTML para entrada do usuário.

O  Form elemento pode conter um ou mais dos seguintes elementos de formulário abaixo:

• input
• textarea
• button
• radiobuton
• checkbox
• select
• option
• optgroup
• fieldset
• label
• output

Atributos

action – Especifica para onde enviar os dados do formulário quando um formulário é enviado

autocomplete – Especifica se um formulário deve ter preenchimento automático ativado ou desativado

enctype – Especifica como os dados do formulário devem ser codificados ao enviá-los ao servidor (apenas para method = “post”) ou (method = “get”)

name – Especifica o nome de um formulário

novalidate – Especifica que o formulário não deve ser validado quando enviado

rel – Especifica a relação entre um recurso vinculado e o documento atual

Formulario com opção de marcar várias opções

 <form action="enviar.php" method="post">
    
   <input type="checkbox" name="html" value="Html">
   <label for="vehicle1"> Html</label><br>
  
   <input type="checkbox" name="css" value="Css">
   <label for="vehicle2"> Css</label><br>
  
   <input type="checkbox" name="jquery" value="jQuery" checked>
   <label for="vehicle3"> jQuery</label><br><br>
  
   <input type="submit" value="Enviar">
 
</form>

Formulário com Opção de selecionar opções alternativas

 <form action="enviar.php" method="post">

   <input type="radio" id="html" name="toturial" value="HTML">
   <label for="html">HTML</label><br>

   <input type="radio" id="css" name="toturial" value="CSS" checked="checked">
   <label for="css">CSS</label><br>

   <input type="radio" id="jquery" name="toturial" value="jquery">
   <label for="jquery">jquery</label><br><br>

   <input type="submit" value="Enviar">

 </form>

Formulário com opção de Selecionar.

<form action="enviar.php" method="post">

  <select name="pais">
    <option value="Brasil">Brasil</option>
    <option value="Estados Unidos">Estados Unidos</option>
    <option value="Japão">Japão</option>
    <option value="Índia">Índia</option>
    <option value="Angola">Angola</option>
    <option value="Marrocos">Marrocos</option>
    <option value="México">México</option>
  </select>

  <input type="submit" value="Enviar">

</form>

Veja mais artigos Sobre Formulários