4. Formularios e Inputs: Interactividad
La ventana hacia tu Servidor
Los formularios son la única forma de que tu sitio web reciba datos: correos para boletines, contraseñas para iniciar sesión o comentarios en una red social. Todo vive dentro de la etiqueta <form>.
✍️ El Mapa del Input
html
HTML
1 <form action="/login" method="POST">
2 <label for="user-id">Introduce tu nombre:</label>
3 <input id="user-id" type="text" name="username" placeholder="Tu nombre aquí..." required>
4
5 <label for="pass-id">Introduce tu contraseña:</label>
6 <input id="pass-id" type="password" name="userpass" required>
7
8 <button type="submit">¡Entrar!</button>
9 </form>
- label for: Conecta el texto con el input (mejor para móviles y lectores).
- type: Cambia drásticamente el input (password, email, date, range, file).
- required: Evita que el usuario mande el formulario vacío.
Selectores y Areas
<textarea>: Para escribir textos largos (párrafos).<select>: Desplegable de opciones (con option).<input type="checkbox">: Casillas de verificación (marcar varios).<input type="radio">: Botones radiales (elegir solo uno de un grupo).