1. ¿Qué es un formulario en HTML?
Se tratan de secciones que están delimitadas por la etiqueta <form>, que contiene
entradas de texto, botones, recuadros de selección y otras características de una
interfaz gráfica. Permite a los usuarios ingresar información que se envían al servidor.
2. Tipos de <input>
1. Texto
El tipo de entrada de texto se utiliza para crear campos de entrada de texto simples.
<input type="text" name="nombre" placeholder="Ingrese su nombre">
2. Correo electrónico
El tipo de entrada de correo electrónico se utiliza para validar que el texto ingresado sea
una dirección de correo electrónico válida.
<input type="email" name="correo" placeholder="ejemplo@[Link]">
3. Contraseña
El tipo de entrada de contraseña se utiliza para crear campos de contraseña que
ocultan los caracteres escritos.
<input type="password" name="contraseña" placeholder="Ingrese su contraseña">
4. Número
El tipo de entrada de número se utiliza para aceptar valores numéricos.
<input type="number" name="cantidad" min="0" max="100" step="1">
5. Fecha
El tipo de entrada de fecha se utiliza para permitir a los usuarios seleccionar fechas en
un calendario.
<input type="date" name="fecha">
6. Archivo
El tipo de entrada de archivo permite a los usuarios cargar archivos desde su
dispositivo.
<input type="file" name="archivo">
7. Botón
El tipo de entrada de botón se utiliza para crear botones interactivos en un formulario.
<input type="button" value="Enviar">
8. Casilla de verificación
El tipo de entrada de casilla de verificación permite a los usuarios seleccionar una o
varias opciones de un conjunto de opciones.
<input type="checkbox" name="opciones" value="opcion1"> Opción 1
<input type="checkbox" name="opciones" value="opcion2"> Opción 2
9. Botón de radio
El tipo de entrada de botón de radio permite a los usuarios seleccionar una opción de un
conjunto de opciones.
<input type="radio" name="opcion" value="opcion1"> Opción 1
<input type="radio" name="opcion" value="opcion2"> Opción 2
10. Área de texto
El elemento <textarea> se utiliza para crear áreas de texto de varias líneas.
<textarea name="mensaje" rows="4" cols="40">Escriba su mensaje aquí</textarea>
11. Reset
El tipo de entrada de reset se utiliza para restablecer los valores de un formulario a sus
valores predeterminados.
<input type="reset" value="Restablecer">
12. Teléfono
El tipo de entrada de teléfono se utiliza para permitir a los usuarios ingresar números de
teléfono.
<input type="tel" name="telefono" placeholder="Ingrese su número de teléfono">
13. Color
El tipo de entrada de color se utiliza para permitir a los usuarios seleccionar un color.
<input type="color" name="color">
14. Rango
El tipo de entrada de rango se utiliza para permitir a los usuarios seleccionar un valor en
un rango determinado.
<input type="range" name="rango" min="0" max="100" step="1">
15. Imagen
El tipo de entrada de imagen se utiliza para mostrar imágenes como botones
interactivos.
<input type="image" src="[Link]" alt="Imagen de ejemplo">
16. Búsqueda
El tipo de entrada de búsqueda se utiliza para permitir a los usuarios buscar información
dentro de un campo de búsqueda.
<input type="search" name="busqueda" placeholder="Buscar...">
17. Time
El tipo de entrada de tiempo se utiliza para permitir a los usuarios seleccionar una hora
específica.
<input type="time" name="hora">
3. Elemento Select
El elemento <select> es un control que muestra el menu de opciones. Las opciones del
menú son representadas por elementos <option>, los cuales pueden ser agrupados por
elementos <optgroup>.
4. Elemento <textarea>
En HTML, el elemento <textarea> representa un control de formulario para la entrada de
texto de varias líneas, ideal para formularios que requieren respuestas más extensas
que un campo de texto de una sola línea.