Quais são os tipos de elementos input em HTML…

Existem os seguintes tipos de elementos input:

text: Campo de texto de uma única linha.
password: Campo para inserir senha, os caracteres estão ocultos.
submit: Botão para enviar o formulário.
reset: Botão para redefinir o formulário.
radio: Seletor (um de vários).
checkbox: Caixa de seleção (uma ou várias de várias).
button: Botão comum.
file: Campo para selecionar arquivo.
hidden: Campo oculto, invisível para o usuário, mas enviado com o formulário.
image: Botão de imagem para enviar o formulário.

A especificação HTML5 adicionou novos tipos:

email: Campo para inserir endereço de email.
url: Campo para inserir URL.
number: Campo para inserir número.
range: Controle deslizante para escolher um valor numérico dentro de um intervalo.
date: Campo para selecionar uma data.
month: Campo para selecionar mês e ano.
week: Campo para selecionar semana e ano.
time: Campo para selecionar hora.
datetime-local: Campo para selecionar data e hora sem fuso horário.
search: Campo de busca.
color: Campo para escolher cor.
tel: Campo para inserir número de telefone.

Exemplo de uso:

<!-- Campo de texto de uma única linha -->
<input type="text" placeholder="Nome">

<!-- Campo para inserir senha -->
<input type="password" placeholder="Senha">

<!-- Botão para enviar o formulário -->
<input type="submit" value="Enviar">

<!-- Botão para redefinir o formulário -->
<input type="reset" value="Redefinir">

<!-- Seletor -->
<input type="radio" name="gender" value="male"> Masculino
<input type="radio" name="gender" value="female"> Feminino

<!-- Caixas de seleção -->
<input type="checkbox" name="interests" value="music"> Música
<input type="checkbox" name="interests" value="sports"> Esportes

<!-- Botão comum -->
<input type="button" value="Clique aqui">

<!-- Campo para selecionar arquivo -->
<input type="file">

<!-- Campo oculto -->
<input type="hidden" name="userId" value="123">

<!-- Botão de imagem -->
<input type="image" src="submit.png" alt="Enviar">

<!-- Campo para email -->
<input type="email" placeholder="Email">

<!-- Campo para URL -->
<input type="url" placeholder="Site">

<!-- Campo para número -->
<input type="number" min="1" max="10">

<!-- Control deslizante -->
<input type="range" min="0" max="100">

<!-- Campo para data -->
<input type="date">

<!-- Campo para mês -->
<input type="month">

<!-- Campo para semana -->
<input type="week">

<!-- Campo para hora -->
<input type="time">

<!-- Campo para data e hora (local) -->
<input type="datetime-local">

<!-- Campo para busca -->
<input type="search" placeholder="Pesquisar">

<!-- Campo para escolher cor -->
<input type="color">

<!-- Campo para número de telefone -->
<input type="tel" placeholder="+7 (xxx) xxx-xx-xx">

Quais são os tipos de elementos input em HTML?