label
¿Qué es label?
Etiqueta HTML que asocia un texto descriptivo con un elemento de formulario, mejorando la accesibilidad y usabilidad
format_indent_increase
Anidando el elemento
<label>Nombre: <input type="text" name="nombre"></label>
link
Con el atributo for
<label for="email">Email:</label>
<input type="email" id="email" name="email">
<input type="email" id="email" name="email">
accessibility
Mejora accesibilidad
touch_app
Área de clic más grande
screen_reader
Compatible con lectores de pantalla
auto_awesome
Mejora experiencia de usuario
code
Ejemplo completo
<form action="/enviar" method="post">
<div class="form-group">
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" required>
</div>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<button type="submit">Enviar</button>
</form>
<div class="form-group">
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" required>
</div>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
</div>
<button type="submit">Enviar</button>
</form>
visibility
Ejemplo visual
tips_and_updates
Característica clave
Al hacer clic en la etiqueta <label>, se enfoca automáticamente el campo de formulario asociado, mejorando la usabilidad