Curso de HTML
Construye la estructura de la web.
Aprende cada etiqueta con ejemplos interactivos y crea proyectos reales.
El atributo type es el que decide cómo se comporta un <input>: como campo de texto, casilla, botón de opción o algo más. Elegir el correcto mejora la experiencia sin escribir una sola línea de JavaScript.
Explicación
<input> es un elemento vacío (sin etiqueta de cierre) cuyo comportamiento cambia según su type:
type="email"Valida automáticamente que el texto tenga forma de correo (algo@algo.algo).
type="password"Oculta el texto escrito con puntos o asteriscos.
type="checkbox"Casilla independiente que se puede marcar o desmarcar sin afectar a otras.
type="radio" + nameBotón de opción. Varios radios con el mismo name son mutuamente excluyentes.
<textarea>Campo de texto multilínea. A diferencia de <input>, sí tiene etiqueta de cierre.
Reto rápido
Estos radios deberían ser mutuamente excluyentes, pero tienen name distinto. Corrígelos para que ambos usen name="envio".
En esta lección
- Ejemplo interactivo
- Explicación de cada etiqueta
- Cuándo usarlo
- Errores comunes
Consejo
Usa type="email" o type="number" en vez de type="text" cuando el dato tiene un formato esperado: el navegador valida el formato básico y muestra un teclado apropiado en móvil.
Dato extra
Existen muchos más tipos de input (date, color, range, tel, url), cada uno con su propio control nativo del navegador.
Error común
Dar el mismo name a checkboxes que deberían ser independientes, o dar distinto name a radios que deberían ser mutuamente excluyentes: rompe el comportamiento esperado del grupo.
Siguiente paso
Ya conoces los tipos de campo más comunes. Ahora aprende a validar que el usuario los complete correctamente.
Ir a la siguiente lección