A tag form (formulário) é utilizada para agrupar elementos interativos, onde o usuário vai inserir informações que serão enviadas para um servidor. As tags mais comuns utilizadas em formulários são:
- Label
- Input
- Button
Exemplo de um formulário html:
<!-- Simple form which will send a POST request -->
<form action="" method="post">
<label for="name">Name:</label>
<input id="name" type="text" name="name" placeholder="escreva seu nome">
<input type="submit" value="Save">
</form>
Vamos quebrar esse código em partes:
<!-- Simple form which will send a POST request -->
<form action="" method="post">
</form>
Primeiro criamos uma tag form que será responsável por agrupar todos os campos e buttons que iremos usar.
<label for="name">Name:</label>
Agora criamos uma tag label que é usada como legenda para a tag input que vamos usar no próximo passo.
<input id="name" type="text" name="name" placeholder="escreva seu nome">
A tag input é como criamos um campo onde o usuário irá digitar as informações, esse campo pode ser de diferentes tipos: (text, email, password). No nosso caso o input tem o tipo "text", notem também que usamos um atributo chamado placeholder que é utilizado para exibir um texto dentro do campo enquanto ele está vazio.
<input type="submit" value="Save">
Por último temos um input com um type especial chamado submit, esse input é utilizado para submeter (enviar) o formulário para um servidor quando ele é clicado. Na prática ele é um button que envia todos os dados escritos nos campos para algum servidor.
Agrupando todas essas tags nós temos nosso primeiro formulário pronto :)
<form action="" method="post">
<label for="name">Name:</label>
<input id="name" type="text" name="name" placeholder="escreva seu nome">
<input type="submit" value="Save">
</form>
