label ටැගය
label ටැගය ආදාන ක්ෂේත්රයක් සඳහා ලේබලයක් අර්ථ දක්වයි
input,
textarea,
select
ආදී වර්ග.
ලේබලය සුවිශේෂී ආදාන ක්ෂේත්රයකට
for ගුණාංගය භාවිතයෙන් බැඳේ. එහිදී
ලේබලය බැඳෙන ආදාන ක්ෂේත්රයේ
id
ගුණාංගයේ අගය දැක්විය යුතුය. එසේම
ලේබලය මූලද්රව්යයකට බැඳේ, එම
මූලද්රව්යය label ටැගය තුළ තැබුවහොත්. මෙම
අවස්ථාවේදී for ගුණාංගය දැක්වීම අවශ්ය නැත. වඩා හොඳ අවබෝධයක් සඳහා උදාහරණ බලන්න.
ලේබලය මත ක්ලික් කිරීමෙන් එයට බැඳුණු චෙක්බොක්ස් හෝ රේඩියෝ බොත්තම් ඒවායේ තත්ත්වය වෙනස් කරයි තෝරාගත් සිට තෝරා නොගත් ලෙසට හා අනෙක් ආකාරයට. මෙම අවස්ථාවේදී ලේබලය පහසුව සඳහා අවශ්යය: කුඩා පෝරම මූලද්රව්රවලට කර්සරයෙන් පහර දීමට අපහසුය, නමුත් දිගු පාඨයක් සහිත ලේබලයකට - බෙහෙවින් පහසුය.
ලේබලයට බැඳුණු පාඨ ආදාන ක්ෂේත්රය
input
හෝ textarea වර්ගයේ
ආදානය ලබා ගනී. ආදානය ලබා ගැනීම
- යනු ක්ෂේත්රය තුළ කර්සරය ක්රියාකාරී වීමයි,
මෙම අවස්ථාවේදී, ඔබ යතුරු පුවරුව මත යමක් ටයිප් කරන්නේ නම් - එම පාඨය ක්ෂේත්රයට ඇතුල් වේ
(ආදානය ගැන දියුණු අවබෝධය සඳහා focus
සුවිශේෂී පන්තිය බලන්න).
label ලේබලය භාවිතා කළ හැකිය
චෙක්බොක්ස්
හෝ රේඩියෝ
බොත්තම් අනුකරණය කිරීමට. මෙය අවශ්ය වන්නේ
චෙක්බොක්ස් හෝ රේඩියෝ බොත්තම් තමන්ගේම අභිරුචියෙන් සැකසීමටයි
(මෙය CSS මගින් සීමා කර ඇත, නමුත් කපටි ක්රම භාවිතයෙන්
හැකි ය).
ගුණාංග
| ගුණාංගය | විස්තරය |
|---|---|
for |
මෙම ගුණාංගය තුළ id ගුණාංගයේ අගය දැක්විය යුතුය
ලේබලය label බැඳෙන ආදාන ක්ෂේත්රයේ.
|
accesskey |
ලේබලයට බැඳුණු පෝරම මූලද්රව්යයට පිවිසීමට භාවිතා කළ හැකි රහස් යතුරක් අර්ථ දක්වයි.
(for ගුණාංගය හරහා). වැඩි විස්තර සඳහා accesskey ගුණාංගය බලන්න.
|
උදාහරණය . චෙක්බොක්ස්
අපි checkbox
කොටුවට for ගුණාංගය භාවිතයෙන් ලේබලයක් බඳිමු.
ලේබලය මත ක්ලික් කර බලන්න, එවිට කොටුවේ තත්ත්වය වෙනස් වීම
තෝරාගත් සිට තෝරා නොගත් ලෙසට හා අනෙක් ආකාරයට දක්නට ලැබේ:
<input type="checkbox" id="checkbox">
<label for="checkbox">මම id checkbox සහිත චෙක්බොක්ස් එකට බැඳී සිටිමි.</label>
:
උදාහරණය . label ඇතුළත
දැන් අපි ලේබලය බැඳීම
for ගුණාංගය හරහා නොකර, මූලද්රව්රය සෘජුවම
label ටැගය තුළ තබමු, මෙම අවස්ථාවේදී පාඨය මත ක්ලික් කිරීමෙන්
label මූලද්රව්යය ක්රියාකාරී කරයි:
<label><input type="checkbox"> ලේබලය</label>
:
උදාහරණය . පාඨ ආදාන ක්ෂේත්රය
අපි input
ටැගයට for ගුණාංගය භාවිතයෙන් ලේබලයක් බඳිමු.
ලේබලය මත ක්ලික් කිරීමෙන් ආදාන ක්ෂේත්රයට
ආදානය ලැබේ. මෙම අවස්ථාවේදී ක්ෂේත්රය තුළ ඇති
පාඨය (value
ගුණාංගය භාවිතයෙන් එකතු කරමු)
තෝරාගනු ඇත. යතුරු පුවරුව මත යමක් ටයිප් කිරීමට පටන් ගන්නේ නම් - මෙම පාඨය මකා දැමෙනු ඇත.
තෝරාගැනීමෙන් මිදීම, පාඨය මකා දැමීමෙන් තොරව, හැකිය
මූසිකය මගින් ක්ෂේත්රය මත ක්ලික් කිරීමෙන්: ආදානය
එම අවස්ථාවේදී අතුරුදහන් නොවන නමුත් තෝරාගැනීම අතුරුදහන් වේ:
<input type="text" id="input1" value="යම් පාඨයක්">
<label for="input1">මම id input1 සහිත ආදාන ක්ෂේත්රයට බැඳී සිටිමි.</label>
:
මෙයද බලන්න
-
legendටැගය,
එය ක්ෂේත්ර සමූහකරණයකට ශීර්ෂකයක් අර්ථ දක්වයි
