Índice:
Vídeo: Curso de HTML5 - 33 - Formulários em HTML5 (parte 1) - by Gustavo Guanabara 2024
Desde o início, as páginas da Web tiveram a capacidade de coletar dados dos usuários. O HTML5 possui um conjunto de elementos de formulário padrão, mas bastante útil, que você pode usar para obter a entrada. Esses elementos de formulário seguem muitas das mesmas regras que outras tags.
Esta figura mostra um formulário contendo todos os elementos principais do formulário HTML que você pode encontrar:
As tags que você usa para gerenciar a estrutura geral do formulário incluem:
-
: Esta etiqueta contém o formulário real; Ele inclui todos os outros elementos do formulário. A tag também deve incluir a ação = "atributo. Isso indica que você não planeja chamar um script do lado do servidor quando o formulário for enviado.
-
: Esta tag especial permite que você agrupe uma série de elementos de entrada. Não é necessário, mas pode tornar as formas complexas mais fáceis de navegar. Por padrão, um fieldset tem uma única borda ao redor, mas você pode mudar isso com CSS.
-
: Você pode adicionar uma legenda a um fieldset para atuar como um rótulo para todo o conjunto de campos.
-
: Isso marca o texto como o rótulo associado a um elemento de entrada específico. Você pode usar o atributo opcional para especificar o elemento de entrada com o qual o rótulo está associado. As tags de etiqueta normalmente são usadas para tornar o estilo CSS mais fácil de gerenciar.
O código de uma página usando todas as tags de estrutura mostradas na figura é executado da seguinte forma:
formDemo. htmlForm Demo
Entrada de textoCaixa de texto
Senha
Área de texto Seu texto aqui
Selecionando elementosSelecione Lista um dois três quatro
Caixas de verificação Presunto Verde Presunto
Botões de rádio pequenos e médios
Botõesbotão padrão
As tags de conjunto de campos, legenda e etiquetas não são necessárias, mas ajudam você a organizar a página, por isso é mais fácil estabelecer com CSS. O uso adequado dessas tags e CSS muitas vezes torna seus formulários muito mais fáceis de trabalhar do que os antigos hacks baseados em tabelas.