HTML cuenta con varios tipos de campos de formulario que se utilizan para recoger información del usuario. A continuación se describen algunos de los tipos más comunes:
Campo de texto
Este campo se utiliza para recoger una respuesta corta de una sola línea del usuario. Ejemplo:
<label for="nombre">Nombre:</label> <input type="text" id="nombre" name="nombre">
Campo de área de texto
Este campo se utiliza para recoger una respuesta más larga del usuario, que puede abarcar varias líneas. Ejemplo:
<label for="comentarios">Comentarios:</label> <textarea id="comentarios" name="comentarios"></textarea>
Campo de selección
Este campo se utiliza para permitir al usuario elegir una opción de una lista. Puede ser de selección simple o múltiple. Ejemplo:
<label for="pais">País:</label> <select id="pais" name="pais"> <option value="EEUU">EEUU</option> <option value="Canadá">Canadá</option> <option value="México">México</option> </select>
Campo de casilla de verificación
Este campo se utiliza para permitir al usuario seleccionar varias opciones de una lista. Ejemplo:
<form> <input type="checkbox" id="perro" name="mascotas" value="perro"> <label for="perro">Perro</label><br> <input type="checkbox" id="gato" name="mascotas" value="gato"> <label for="gato">Gato</label><br> <input type="checkbox" id="pez" name="mascotas" value="pez"> <label for="pez">Pez</label> </form>
Campo de opción
Este campo se utiliza para permitir al usuario elegir una opción de un grupo de opciones. Ejemplo:
<form> <input type="radio" id="hombre" name="sexo" value="hombre"> <label for="hombre">Hombre</label><br> <input type="radio" id="mujer" name="sexo" value="mujer"> <label for="mujer">Mujer</label><br> <input type="radio" id="otro" name="sexo" value="otro"> <label for="otro">Otro</label> </form>
Campo de archivo
Este campo se utiliza para permitir al usuario subir un archivo desde su dispositivo. Ejemplo:
<label for="archivo">Seleccione un archivo:</label> <input type="file" id="archivo" name="archivo">
Campo de fecha
Este campo se utiliza para permitir al usuario seleccionar una fecha. Ejemplo:
<label for="fecha">Fecha:</label> <input type="date" id="fecha" name="fecha">
Campo de correo electrónico
Este campo se utiliza para recoger una dirección de correo electrónico del usuario. Ejemplo:
<label for="email">Correo electrónico:</label> <input type="email" id="email" name="email">
Campo de contraseña
Este campo se utiliza para recoger una contraseña del usuario. Este campo oculta la información introducida para protegerla. Ejemplo:
<label for="password">Contraseña:</label> <input type="password" id="password" name="password">
Campo de botón
Este campo se utiliza para crear un botón que el usuario puede hacer clic para enviar el formulario. Ejemplo:
<input type="submit" value="Enviar">
Recuerda que es importante agregar atributos de "name" y "id" a cada campo para poder procesar y validar la información enviada en el formulario en el lado del servidor.
