تسميات المدخلات
جزء من قسم الأساسيات في رحلة HTML على Coddy. الدرس 39 من 60.
ليس من الواضح دائمًا ما الغرض من حقل الإدخال من دون تسمية. تمنح التسمية المستخدمين إشارة مرئية واضحة إلى نوع الإدخال المتوقع في ذلك الحقل. تُنشأ التسميات باستخدام وسم <label>.
إليك الصيغة الأساسية:
<label for="field">Label text</label>
<input type="text" id="field"><label>: الوسم الذي يُنشئ التسمية.
for: رابط بين التسمية وحقل النموذج. يجب أن تطابق قيمةforقيمةidلحقل النموذج.
- نص التسمية: النص الذي يصف الغرض من حقل النموذج.
<input>: حقل النموذج الذي يشير إليه التسمية.
id: المعرّف الفريد لحقل النموذج، والذي يطابق السمةforفي التسمية.
بمجرد ربطهما، يؤدي النقر على نص التسمية إلى وضع المؤشر في حقل الإدخال (تركيزه)، ما يمنح المستخدمين أيضًا مساحة أكبر للنقر.
التحدي
سهلأضف العلامات التالية داخل علامة <form>:
- علامة
<label>بالنص 'First Name:' واجعل قيمة السمةforهي 'firstname'. - حقل
<input>معtype="text". - يجب أن يكون للحقل
<input>سمةidتطابق سمةforالخاصة بالعلامة.
جرّب بنفسك
<!DOCTYPE html>
<html>
<body>
<form>
<!-- اكتب الكود هنا -->
</form>
</body>
</html>
اختبر نفسكيتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.
جميع دروس الأساسيات
2النصوص والتنسيق
العناوينالفقراتفواصل الأسطرالنص العريض والمائلالنص العريض والمائل مجدداًمراجعة - التنسيق8النماذج والمدخلات - الجزء الأول
أساسيات النماذجمدخلات النصوصسمات المدخلاتحقل كلمة المرورتسميات المدخلاتملخص - نموذج أساسي11صفحة التسجيل في الفعالية
نظرة عامة على المشروعقسم الـ Header
قسم تفاصيل الفعاليةنموذج التسجيلقسم الـ Footerتدرّب بنفسك: Playground لـ Web