A tag de formulário HTML é necessária quando você deseja coletar informações fornecidas pelos visitantes. Por exemplo, você pode coletar dados específicos dos visitantes, como nome, endereço de e-mail e senha.
A tag HTML
Um formulário é essencialmente um contêiner para entradas.
O código a seguir mostra a estrutura básica de um formulário:
Os elementos de entrada vão aqui
Existem dois atributos da tag de formulário com os quais devemos estar familiarizados:
- O atributo action aponta para o back-end de nossa página da web, que lida com o envio do formulário
- O atributo method é usado para fazer upload dos dados. Os atributos mais comumente usados são os métodos GET e POST
Observação: o formulário não funcionará até que o back-end seja criado.
O Elemento
O HTML é um elemento fundamental do formulário. Ele pode ser exibido de várias maneiras, dependendo de seus atributos.
Existem vários tipos de entradas. Alguns dos mais importantes incluem:
Texto do tipo de entrada
O define um campo de entrada de texto de uma linha.
É assim que o código HTML acima será exibido no navegador:
Senha do tipo de entrada
O define um campo de senha.
Isso produzirá o seguinte resultado:
Envio de tipo de entrada
O define um botão para enviar dados do formulário para uma página do servidor.
Isso produzirá o seguinte resultado.
Rádio do tipo de entrada
O define um botão de opção. O botão de rádio é usado quando apenas uma única opção precisa ser selecionada entre várias opções oferecidas.
Isso produzirá o seguinte resultado:
Caixa de seleção do tipo de entrada
A define uma caixa de seleção. As caixas de seleção são usadas quando uma (ou mais de uma) opção deve ser selecionada.
Isso produzirá o seguinte resultado:
O
Um rótulo pode ser atribuído com um elemento
Controle de entrada de texto de várias linhas
Isso é usado quando o usuário precisa inserir detalhes que podem exceder uma única frase.
Isso produzirá o seguinte resultado:
Exemplo de formulário HTML
Agora é hora de criar um formulário de registro simples. Criaremos um formulário simples que solicitará que o usuário insira seu nome, e-mail, senha, gênero e endereço para concluir a inscrição.
Isso produzirá o seguinte resultado:
Obtenha habilidades em HTML5 e CSS3 com o Programa Full Stack Java Developer Master . Clique para verificar os detalhes do programa!
Próximas etapas
Este artigo sobre formulários HTML deu uma ideia de como os formulários HTML funcionam e como criá-los. Abordamos vários tipos de entrada que são necessários para criar um formulário HTML. Se você está procurando um programa educacional mais abrangente em desenvolvimento web, uma certificação pode ser a maneira perfeita de começar sua nova carreira. O Desenvolvedor Java Full Stack da Simplilearn ajudará você a dominar o desenvolvimento da web e fornecer a você as ferramentas de que você precisa para aprender desenvolvedor da web tecnologias a partir do zero. Você aprenderá como construir um aplicativo ponta a ponta, testar e implantar código, armazenar dados usando MongoDB e muito mais.
Se você tiver alguma dúvida ou feedback, informe-nos na seção de comentários. Nossos especialistas responderão o mais rápido possível.