Carregando...

Html form

Postado: 7 de dezembro de 2021 Tempo de Leitura: 2 Minutos

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

Publicado por: Loop Nerd

1.604 Visualizações

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Artigos Relacionados