TaskHtml
تفاصيل العمل
الصفحة عبارة عن نموذج (Form) لجمع بيانات شخصية مع بعض التنسيقات بالألوان والعناصر المختلفة:
الهيكل الأساسي:
الصفحة HTML عادية بعناصر <html>, <head>, <body>.
النموذج <form> يحتوي على حاوية <fieldset> بلون خلفية بني لتجميع كل بيانات النموذج.
العنوان الرئيسي للقسم <legend> بعنوان personla data بخلفية زرقاء.
قسم الاسم الشخصي (Your Name):
<fieldset> داخلي بخلفية شوكولاتة وعنوان أزرق.
جدول <table> يحتوي على حقلي إدخال:
first name (اسم أول) مع placeholder "ex. ahmed".
last name (اسم العائلة) مع placeholder "ex. youssef".
بيانات الاتصال (Contact Info):
جدول يحتوي على:
حقل الهاتف (type="tel")
البريد الإلكتروني (type="email")
كلمة المرور (type="password")
إعادة إدخال كلمة المرور (type="password")
اختيار الجنس (Gender):
جدول بعنصري Radio Buttons:
female
male
كلاهما يستخدم نفس الاسم (name="gender") علشان يختار المستخدم واحد بس.
الحالة التعليمية (Status):
جدول بعنصري Checkboxes:
student
graduated
المستخدم ممكن يختار أكتر من خيار.
قائمة منسدلة (Dropdown):
<select> يحتوي على مجموعات خيارات (optgroup) بعناوين مختلفة:
group 3 (فيه option 1.1 و options 3.x)
group 2 (فيه options 2.1 و 2.2).
زر صورة (Image Button):
عنصر <input type="image"> يستخدم صورة مخزنة في مجلد image كزر (alt="button" بعرض 30px)