لیست‌ها

لیست‌های نامرتب، مرتب و تعریفی در HTML

چرا به لیست‌ها نیاز داریم؟

لیست‌ها برای نمایش اطلاعات به‌صورت آیتم‌های مرتبط استفاده می‌شوند. HTML سه نوع اصلی لیست دارد: نامرتب، مرتب و تعریفی.

لیست نامرتب (Unordered List)

لیست نامرتب با تگ <ul> ساخته می‌شود. هر آیتم با <li> مشخص می‌شود. آیتم‌ها معمولاً با دایره یا نقطه نمایش داده می‌شوند.

<ul>
  <li>آیتم اول</li>
  <li>آیتم دوم</li>
  <li>آیتم سوم</li>
</ul>

لیست مرتب (Ordered List)

لیست مرتب با تگ <ol> ساخته می‌شود. آیتم‌ها با عدد نمایش داده می‌شوند.

<ol>
  <li>مرحله اول</li>
  <li>مرحله دوم</li>
  <li>مرحله سوم</li>
</ol>

ویژگی‌های لیست مرتب

ویژگیکاربردمثال
typeنوع شماره‌گذاری1, A, a, I, i
startشماره شروعstart="5"
reversedمعکوسreversed
<ol type="A">
  <li>آیتم A</li>
  <li>آیتم B</li>
  <li>آیتم C</li>
</ol>

<ol start="5">
  <li>شماره ۵</li>
  <li>شماره ۶</li>
  <li>شماره ۷</li>
</ol>

لیست تعریفی (Description List)

لیست تعریفی با تگ <dl> ساخته می‌شود. برای نمایش جفت‌های نام-مقدار استفاده می‌شود:

<dl>
  <dt>HTML</dt>
  <dd>زبان نشانه‌گذاری ابرمتن برای ساخت صفحات وب</dd>
  
  <dt>CSS</dt>
  <dd>زبان استایل‌دهی برای ظاهر صفحات وب</dd>
  
  <dt>JavaScript</dt>
  <dd>زبان برنامه‌نویسی برای تعامل و رفتار صفحات وب</dd>
</dl>

لیست‌های تودرتو (Nested Lists)

می‌توان لیست‌ها را داخل هم قرار داد:

<ul>
  <li>میوه‌ها
    <ul>
      <li>سیب</li>
      <li>پرتقال</li>
    </ul>
  </li>
  <li>سبزیجات
    <ul>
      <li>کاهو</li>
      <li>گوجه</li>
    </ul>
  </li>
</ul>

نکات مهم

این مبحث بخشی از دوره آموزش کامل HTML است.

ابزارهای مرتبط