El elemento <label>
El elemento <label> se usa para especificar una etiqueta para otro
elemento en el documento. El elemento requiere un comando de apertura y uno de cierre.
El elemento es un elemento inline. El contenido del control etiqueta es renderizado.
Ejemplo:
<html>
<head>
<title>El Elemento label</title>
</head>
<body>
<label
for="input1">Haga clic en este texto para establecer
focus en el recuadro.</label>
<input
id="input1">
<br
/><br
/>
<label
for="input2"> Haga clic en este texto para establecer
focus en el recuadro.</label>
<input
id="input2">
<br
/><br
/>
Este texto no responde al elemento label.
</body>
</html>
En el ejemplo de arriba, establecemos el atributo “for” del elemento
<label>
al control especificado, en este caso el elemento id <input>. El ejemplo de abajo
cambiará el color de fondo del elemento
<input> mediante un script cuando
el elemento <input> esté enfocado.
<html>
<head>
<title>El elemento label</title>
<script>
function GotFocus(TheInput)
{
var zapped = document.getElementById(TheInput);
zapped.style.backgroundColor="#ff0000";
}
function LostFocus(TheInput)
{
var zapped = document.getElementById(TheInput);
zapped.style.backgroundColor="#ffffff";
}
</script>
</head>
<body>
<label
for="input1"
style="cursor: hand; color: #ff0000; font-family: Arial; text-decoration:
underline;">Haga clic en este texto para establecer focus en
el recuadro.</label>
<input
id="input1" onfocus="return
GotFocus('input1')"
onblur="return LostFocus('input1')">
<br
/><br
/>
<label
for="input2" style="cursor:
hand; color: #ff0000; font-family: Arial; text-decoration: underline;">Haga
clic en este texto para establecer focus en el recuadro.</label>
<input
id="input2"
onfocus="return GotFocus('input2')"
onblur="return
LostFocus('input2')">
<br
/><br
/>
Este texto no responde al elemento label.
</body>
</html>
|
|