لیست‌های 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> به جای آن استفاده کنید.