Tipos de INPUT en HTML
El elemento HTML <input> se usa para crear controles interactivos para formularios basados en la web con el fin de recibir datos del usuario.Hay disponible una amplia variedad de tipos de datos de entrada y widgets de control, que dependen del dispositivo y el agente de usuario (user agent).El elemento <input> es uno de los más potentes y complejos en todo HTML debido a la gran cantidad de combinaciones de tipos y atributos de entrada.
Listado de tipos de input
A continuación está la lista de todos los tipos de input en HTML.
Input type text
Probablemente este sea el campo más utilizado en los formularios HTML que realizamos habitualmente.
Es un input para insertar una línea de texto. Los saltos de línea son eliminados automáticamente del valor introducido.
<input type="text">Input type number
Destinado a insertar valores valores numéricos.
<input type="number">Input type password
Es un campo para insertar una contraseña. Al insertar un valor, este es ocultado automáticamente.
<input type="password">Input type submit
Es un input que envía el formulario. Por defecto, se representa como un botón.
<input type="submit">Input type reset
Campo que restaura el valor de los campos del formulario. Por defecto, se representa como un botón.
<input type="reset">Input type radio
Botón radio. Se debe usar el atributo value para definir el valor que se enviará por este elemento. Se usa el atributo checked para indicar si el elemento está seleccionado de forma predeterminada. Los botones radio que tengan el mismo valor para su atributo name están dentro del mismo «grupo de botones radio». Solo un botón radio dentro de un grupo puede ser seleccionado a la vez.
<input type="radio">Input type checkbox
Casilla de selección. Se debe usar el atributo value para definir el valor que se enviará por este elemento. Se usa el atributo checked para indicar si el elemento está seleccionado. También se puede usar el atributo indeterminate (el cual solo se puede establecer programaticamente) para indicar que la casilla está en un estado indeterminado (en la mayoría de las plataformas, se dibuja una línea horizontal a través de la casilla).
<input type="checkbox">Input type button
Botón sin un comportamiento específico.
<input type="button" value="Ejecutar">Input type color
Control para espicificar un color. Una interfaz de selección de color no requiere más funcionalidad que la de aceptar colores simples como texto.
<input type="color">Input type date
Input para introducir una fecha (año, mes y día, sin tiempo).
<input type="date">Input type datetime-local
Campo para introducir fecha y hora, sin zona horaria específica.
<input type="datetime-local">Input type email
Control para introducir una dirección de correo electrónico. El valor introducido se valida para que contenga una cadena vacía o una dirección de correo válida antes de enviarse.
<input type="email">Input type file
Campo que permite al usuario seleccionar un archivo. Se puede usar el atributo accept para definir los tipos de archivo que el control podrá seleccionar.
<input type="file">Input type hidden
Input que no es mostrado en pantalla, pero cuyo valor es enviado al servidor.
<input type="hidden">Input type month
Control para introducir un mes y año, sin zona horaria específica.
<input type="month">Input type range
Input para inserter un valor que se elige en un elemento deslizante.
<input type="range" min="0" max="10">Input type search
Cuadro de texto de línea simple para introducir textos de búsqueda. Los saltos de línea son eliminados automáticamente del valor introducido.
<input type="search">Input type tel
Control para introducir un número telefónico. Los saltos de línea son eliminados automáticamente del valor introducido, pero no hay otra sintaxis forzada. Se pueden usar atributos como pattern y maxlength para restringir los valores introducidos en este control.
<input type="tel">Input type time
Input para introducir un valor de tiempo sin zona horaria específica.
<input type="time">Input type url
Campo para editar una URL. El valor introducido se valida para que contenga una cadena vacía o una ruta URL absoluta antes de enviarse. Los saltos de línea y espacios en blanco al principio o al final del valor son eliminados automáticamente.
<input type="url">Input type week
Control para introducir una fecha que consiste en número de semana del año y número de semana sin zona horaria específica.
<input type="week">