الجمعة، 16 نوفمبر 2012
2- أمثلة على استخدام الوسوم الفردية
3-القائمة LE MENU
1-3 - القوائم المرتبة
les listes ordonnées
2-3 - القوائم الغير مرتبة
les listes non ordonnées
4- الفيديو التطبيقي المرفق
5- تحميل الدرس بصيغة WORD
1-أمثلة على استخدام الوسوم الثنائية
عند تطبيق وسم ثنائي على جزء من الصفحة فإننا نحصر ذالك الجزء بين وسم الافتتاح ووسم الإغلاق , مثلا .. عند كتابة فقرة نصية :
<p> هنا نكتب النص </p>
أو عند كتابة عنوان نصي في صفحتنا فإن بإمكاننا إستخدام أحد الوسوم المخصصة لذالك وهي
h1 , h2 , h3 , h4 , h5 وتطبيق أحدها على العنوان ... مثلا :
<h2> عنوان النص </h2>
وسيتم ايضاح ذالك أكثر في الفيديو المرفق .
2-أمثلة على استخدام الوسوم الفردية
أما بالنسبة للوسوم الفردية فهي عادة تحتوي على الإعدادات الداخلية التي تقوم بتنفيذها مباشرة ... مثلا نستخدم وسم < / br> لإضافة سطر فارغ , ونستخدم < / hr > لإضافة خط أفقي في الصفحة .. وفي الدرس السابق تعرفنا على وسم إضافة الصور ويتم استخدمه كالتالي
<img src=" images / montagne .jpg" title=" Photo de montagne " />
حيث src تحتوي على رابط الصورة و title هو عنوان الصورة عند تمرير الفأرة عليها , وسيتناول الفيديو المرفق ذالك بتفصيل .3-القائمة LE MENU
في غالبية المواقع التي نزورها دائما ما تكون هناك قائمة تسمح لنا بالوصول إلى مختلف أقسام الموقع , تكون عادة على شكل مجموعة عناصر مرتبة بشكل معين عند الضغط على أحدها ننتقل مباشرة إلى محتوى آخر للموقع , ويمكن تقسم القوائم إلى :
- قوائم مرتبة les listes ordonnées
- قوائم غير مرتبة les listes non ordonnées
3-1 القوائم المرتبة les listes ordonnées
مثلا للحصول على قائمة مشابهة لهذه :
1. الصفحة الرئيسية
2. أهداف الموقع
3. من نحن
نقوم باستخدام الكود التالي
<!DOCTYPE html>
<html dir='rtl'>
<head>
<title>عنوان الموقع </title>
</head >
<body>
<h1> القائمة الأساسية للموقع </h1>
<ol>
<li> الصفحة الرئيسية </li>
<li> أهداف الموقع </li>
<li> من نحن </li>
</ol>
</body>
</html>
قمت بإعداد الصفحة لتظهر لنا القائمة من اليمين الى الشمال للتتماشى مع اتجاه الخط العربي من خلال إضافة الإعداد المخصص لذالك إلى وسم الصفحة الرئيسي كالتالي :
<html dir=’rtl’>
لتكون النتيجة كالتالي بعد المعاينة في متصفح الانترنت
هناك أنواع أخرى من القوائم المرتبة :
لترتيب القائمة بالحرف اللاتنيني الصغير <ol type=a>
Lettres minuscules
لترتيب القائمة بالحرف اللاتنيني الصغير <ol type=A>
Lettres minuscules
لترتيب القائمة بالترقيم الروماني الصغير <ol type=i>
Chiffres romains en minuscules
لترتيب القائمة بالترقيم الروماني الصغير <ol type=I>
Chiffres romains en majuscules
مثال لقائمة بترقيم روماني كبير
<h1> القائمة الأساسية للموقع </h1>
<ol type=I>
<li> الصفحة الرئيسية </li>
<li> أهداف الموقع </li>
<li> من نحن </li>
</ol>
3-2- القوائم الغير مرتبة
وهي القائمة التي لا تحتوي على أي ترقيم , لإنشاء قائمة كتلك :
<h1> القائمة الأساسية للموقع </h1>
<ul>
<li> الصفحة الرئيسية </li>
<li> أهداف الموقع </li>
<li> من نحن </li>
</ul>
هناك أشكال أخرى من القوائم الغير مرتبة وهي :
لإضافة دائرة فارغة عند بداية كل عنصر <ul type=circle>
لإضافة مربع مليء عند بداية كل عنصر من القائمة<ul type=square>
لإضافة دائرة مليئة عند بداية كل عنصر <ul type=disc>
مثال على قائمة غير مرتبة وبشكل دائرة فارغة تظهر بجانب جميع عناصرها
<h1> القائمة الأساسية للموقع </h1>
<ul type=circle>
<li> الصفحة الرئيسية </li>
<li> أهداف الموقع </li>
<li> من نحن </li>
</ul>
عينة من مختلف القوائم الغير مرتبة
4- الفيديو المرفق
5- تحميل الدرس بصيغة word
اضغط هنا لتحميل الدرس
ليست هناك تعليقات:
إرسال تعليق