تعلم لغة html: اللوائح lists

تعلم لغة html: اللوائح lists

هناك العديد من الوظائف التي تستعمل فيها اللوائح عند تصميم موقع. وتنقسم إلى ثلاثة انواع:
  • اللوائح الترقيمية   Numbered Lists
  • اللوائح بالنقط Bullet Lists
  • اللوائح التعريفية  Definition List
  • اللوائح الترتيبية Ordered Lists 

اللوائح الترتيبية Ordered Lists

تبدأ ب وسم  <ol>  وتغلق بوسم </ol>
ثم يتم وضع عناصر اللائحة داخل وسم أخر يبدا ب <li> وينتهي ب </li>
الكود
<ol>
<li>العنصر 1</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ol>

النتيجة

اللوائح الغير الترتيبية

تبدأ ب وسم <ul>  وتغلق بوسم </ul>
ثم يتم وضع عناصر اللائحة داخل وسم أخر يبدا ب <li> وينتهي ب </li>
الكود
<ul>
<li>العنصر 1</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ul>

النتيجة

اللوائح التعريفية

تبدأ ب وسم <dl>  وتغلق بوسم </dl>
ثم يتم وضع النص المراد تعريفه بين وسمي <dt> و </dt>
بعد ذلك يتم وضع التعريف بين وسمي <dd> و </dd>
الكود
<dl>
<dt>فولفولي</dt>
<dd>مدونة تقدم دروس مختلفة للاستفادة من الإنترنت</dd>
<dt>جوجل</dt>
<dd>موقع البحث</dd>
</dl>

النتيجة

اللوائح المتداخلة Nested Lists

يتم وضع لائحة داخل لائحة
يتم  وضع لائحة أخرى داخل لائحة، كل هذا داخل عنصر من الائحة الرئيسية يبدأ ب <li>  وينتهي ب </li>.
الكود
<ul>
<li>العنصر 1
<ol>
<li>العنصر 1</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ol>
</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ul>

النتيجة


لكل سؤال أو إضافة، يرجى كتابة تعليقك في الخانة اسفله