قوائم HTML

HTML يدعم القوائم المنظمة، غير المنظمة، وقوائم التعريف

مثال

قائمة غير منظمه
هذا المثال يعرض قائمة غير منظمه.
قائمة منظمه
هذا المثال يعرض قائمة منظمه.

(يمكن العثور على أمثلة إضافية في أسفل الصفحة.)

قائمة غير منظمه

قائمة غير منظمه هي قائمة من المشاريع، وتستخدم علامات النقاط الكبيرة (النقاط السوداء الصغيرة) لتعليماتها.

قائمة غير منظمه تبدأ بـ <ul> العلامة. كل عنصر قائمة يبدأ بـ <li>.

<ul>
<li>القهوة</li>
<li>اللبن</li>
</ul>

يظهر المتصفح كما يلي:

  • القهوة
  • اللبن

يمكن استخدام الفقرات والسطور الجديدة والصور والروابط وأي قوائم أخرى داخل عناصر القائمة.

قائمة منظمه

على نفس الطريقة، القوائم المرتبة هي قائمة بالمشاريع، ويتم تمييز العناصر بالأرقام.

تبدأ القوائم المرتبة بـ <ol> علامة. تبدأ كل عنصر القائمة بـ <li> علامة.

<ol>
<li>القهوة</li>
<li>اللبن</li>
</ol>

يظهر المتصفح كما يلي:

  1. القهوة
  2. اللبن

يمكن استخدام الفقرات والسطور الجديدة والصور والروابط وأي قوائم أخرى داخل عناصر القائمة.

قائمة المحددات

القوائم المخصصة ليست مجرد قائمة بالمشاريع، بل هي مجموعة من المشاريع وشرحها.

تبدأ القوائم المخصصة بـ <dl> علامة. تبدأ كل عنصر قائمة بـ <dt> علامة. تبدأ تعريف كل عنصر القائمة بـ <dd> علامة.

<dl>
<dt>القهوة</dt>
<dd>مشروب حار أسود</dd>
<dt>اللبن</dt>
<dd>مشروب بارد أبيض</dd>
</dl>

يظهر المتصفح كما يلي:

القهوة
مشروب حار أسود
اللبن
مشروب بارد أبيض

يمكن استخدام الفقرات والسطور الجديدة والصور والروابط وأي قوائم أخرى داخل عناصر قائمة المحددات.

مزيد من الأمثلة

أنواع القوائم غير المرتبة المختلفة
هذا المثال يعرض قائمة غير مرتبة.
أنواع القوائم المرتبة المختلفة
هذا المثال يعرض أنواع القوائم المرتبة المختلفة.
قائمة متشابكة
هذا المثال يعرض كيفية تضمين القوائم.
قائمة متشابكة 2
هذا المثال يعرض قائمة متشابكة أكثر تعقيدًا.
قائمة المحددات
هذا المثال يعرض قائمة المحددات.

علامات القائمة

العلامة الوصف
<ol> تعريف القائمة المرتبة.
<ul> تعريف القائمة غير المرتبة.
<li> تعريف عنصر القائمة.
<dl> تعريف قائمة المحددات.
<dt> تعريف عنصر المحدد.
<dd> تعريف الوصف المحدد.
<dir> مستأنفة. استخدم <ul> بدلاً منه.
<menu> مستأنفة. استخدم <ul> بدلاً منه.