هناك العديد من الوظائف التي تستعمل فيها اللوائح عند تصميم موقع. وتنقسم إلى ثلاثة انواع:
ثم يتم وضع عناصر اللائحة داخل وسم أخر يبدا ب <li> وينتهي ب </li>
الكود
النتيجة
ثم يتم وضع عناصر اللائحة داخل وسم أخر يبدا ب <li> وينتهي ب </li>
الكود
النتيجة
ثم يتم وضع النص المراد تعريفه بين وسمي <dt> و </dt>
بعد ذلك يتم وضع التعريف بين وسمي <dd> و </dd>
الكود
النتيجة
يتم وضع لائحة أخرى داخل لائحة، كل هذا داخل عنصر من الائحة الرئيسية يبدأ ب <li> وينتهي ب </li>.
الكود
النتيجة
- اللوائح الترقيمية 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>
<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>
<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>
<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>
<li>العنصر 1
<ol>
<li>العنصر 1</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ol>
</li>
<li>العنصر 2</li>
<li>العنصر 3</li>
</ul>
النتيجة