Formularios en HTML

¿Qué es un formulario en HTML?

Un formulario en HTML permite a los usuarios enviar datos a un servidor. Los formularios se crean utilizando la etiqueta <form> y pueden contener varios tipos de campos de entrada, como campos de texto, botones de radio, casillas de verificación, y botones de envío.

Estructura básica de un formulario

La estructura básica de un formulario incluye la etiqueta <form>, que contiene todos los elementos del formulario. Aquí tienes un ejemplo simple:

<form action="/submit" method="post">
    <!-- Campos de entrada aquí -->
</form>

Campos de texto

Los campos de texto se crean utilizando la etiqueta <input> con el atributo type="text". Aquí tienes un ejemplo de un campo de texto con una etiqueta asociada:

<form action="/submit" method="post">
    <label for="nombre">Nombre:</label>
    <input type="text" id="nombre" name="nombre">
</form>

Botones de radio

Los botones de radio permiten a los usuarios seleccionar una opción entre varias. Todos los botones de radio que comparten el mismo valor de name pertenecen al mismo grupo:

<form action="/submit" method="post">
    <p>Género:</p>
    <input type="radio" id="masculino" name="genero" value="masculino">
    <label for="masculino">Masculino</label><br>
    <input type="radio" id="femenino" name="genero" value="femenino">
    <label for="femenino">Femenino</label>
</form>

Casillas de verificación

Las casillas de verificación permiten a los usuarios seleccionar múltiples opciones. Aquí tienes un ejemplo:

<form action="/submit" method="post">
    <p>Lenguajes de programación favoritos:</p>
    <input type="checkbox" id="python" name="lenguaje" value="python">
    <label for="python">Python</label><br>
    <input type="checkbox" id="javascript" name="lenguaje" value="javascript">
    <label for="javascript">JavaScript</label><br>
    <input type="checkbox" id="java" name="lenguaje" value="java">
    <label for="java">Java</label>
</form>

Botones de envío

Para enviar los datos del formulario, se utiliza un botón de envío, creado con <input> o <button> con el atributo type="submit":

<form action="/submit" method="post">
    <input type="submit" value="Enviar">
</form>