حل درس بنية المحتوى تقنية رقمية 1

عرض بكامل الشاشة

البيانات

حل درس بنية المحتوى تقنية رقمية 1

القوائم 

هناك نوعان من القوائم المستخدمة في مواقع الويب : 

قائمة مرتبة ( Ordered List ) :  في هذه القائمة ، يتم اتباع تسلسل رقمي بحيث يتم ترقيم كل عنصر في القائمة 
 قائمة غير مرتبة ( Unordered List )  :  يتم تمييز عناصر هذه القائمة بتعداد نقطي 

القائمة المرتبة ( Ordered List ) 

يتم إنشاء القائمة المرتبة استخدام وسم  < ol>  حيث يتم وضع كل عنصر في هذه القائمة بين وسم الفتح < li >  < li/ > 

لنلق نظرة على المثال التالي : 

< DOCTYPE html!>

<html dir = rtl lang = ar>

< head >

     <title  />  < title Examples >
< / meta charset = UTF.8>

< head / >

< body >

< hl/>  ألعاب جماعية < hl>

< ol >

  <  li/> كرة القدم <li>
  <  li/> كرة السلة  <li>

 <  li/> كرة اليد  <li>

  <  li/> كريكيت <li>
<ol/>
< body />

< html />

صفحة معجبي كرة القدم 

كي نضيف قوائم نادي مشجعي كرة القدم في مشروعم عليك أولا أن تنشئ قائمة تكون شريط للتنقل داخل 

>الصفحة الرئيسة 

>التاريخ

>المعرض 

>نبذة 

>اتصل بنا 

< DOCTYPE html!>

<html dir = rtl lang = ar>

< head >

    <  Football Fan page / <title  /  >
< / meta charset = UTF.8>

< head / >

< body >

< ul>

< hl/>  الصفحة الرئيسة  < hl>

  <  li/> التاريخ  <li>
  <  li/> المعرض <li>

 <  li/> نبذة   <li>

  <  li/> اتصل بنا  <li>
< ul />

< hl/>  تعمل كرة القدم على جمع الناس معا   < hl>

لنطبق معا 

تدريب 1

السؤال : حدد و أصلح الاخطاء في البرنامج التالي 

الجواب : 

< DOCTYPE html>

<html dir = rtl lang = ar>

< head >

     <title  />  < title Examples >
< / meta charset = UTF.8>

< head / >

< body >

< hl/>  المواد الدراسية < hl>

< ul >

  <  li/> الرياضيات  < li >
 

<  li/>اللغة العربية  < li >

 <  li/> التاريخ   < li >
< body />

< html />

تدريب 2

أنشئ صفحة ويب تتكون من قائمة غير منسقة بعنوان البريد الإلكتروني للأصدقاء تتضمن هذه الصفحة عناوين البريد الإلكتروني لأصدقائك ويتم فتح تطبيق البريد الإلكتروني في علامة تبويب مختلفة و ذلك عند الضغط على أحد هذه العناوين 

< DOCTYPE html!>

<html dir = rtl lang = ar>

< head >

     <title  />  < title Examples >
< / meta charset = UTF.8>

< head / >

< body >

< hl/>  البريد الإلكتروني < hl>

< ul >

<  li/>اللغة العربية  < li >

 <  li/> التاريخ   < li >

< ul >
< body />

< html />

تدريب3

1- انشئ قائمة عناصر مرتبة تتكون من 3 روابط  لمواقع مختلفة يفتح كل منها في نافذة جديدة 

2- انشئ قائمة باطعمتك المفضلة 

3- اعرض صورة بحيث يتم فتح صفحة ويب لمحرك بحث من اختيارك ( مع مراعاة ان يفتح في نافذة جديدة ) و ذلك عند الغلط على تلك الصورة 

< DOCTYPE html!>

<html dir = rtl lang = ar>

< head >

     <title  />  < title Examples >
< / meta charset = UTF.8>

< head / >

< body >

< ol >

< ol >

 < hl/> الاطعمة المفضلة < hl>

< ul>

< li/ >  الحمص   < li> 

<  li/>الطعام   < li >

 <  li/> الطعام    < li >

 <  li/> الطعام    < li >

< ul >
< body />

< html />

شارك الملف

آخر الملفات المضافة