لیست ها در HTML بخش دوم Ordered Lists لیست شمارشی

لیست ها در اچ تی ام ال بخش دوم را جهت مطالعه شما مخاطبان محترم سایت آموزی تهیه کردیم.

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

لیست ها در اچ تی ام ال بخش دوم

لیست ها در HTML بخش دوم Ordered Lists لیست شمارشی - سایت آموزی

در بخش دوم این آموزش قصد داریم شما عزیزان رو با نوع دیگری از لیست ها در HTML آشنا کنیم.

لیست های مرتب ( شمارشی ) نوع دیگری از لیست ها هستند که در بخش دوم به توضیح اونها می پردازیم.

لیست های مرتب ( Ordered Lists )

لیست مرتب یا ترتیبی با تگ ol  در ابتدای آن ها همراه است.

این نوع لیست ها عددی هستند و آیتم های آن شماره گذاری می شوند.

تگ ol در اچ تی ام ال

اگر در سند html خود قصد ساختن لیست های مرتب یا شمارشی دارید، بایستی از تگ ol استفاده کنید.

تگ ol دارای یک تگ باز ( Opening Tag ) و یک تگ بسته ( Closing Tag ) می باشد.

در حقیقت تگ ol به تنهایی نمی تواند لیست شمارشی ایجاد کند.

و برای اینکه بتواند لیست بسازد، بایستی آیتم های این لیست درون تگ ol تعریف شود.

لیست ها در HTML بخش دوم Ordered Lists لیست شمارشی

تگ li

همانطور که اشاره شد، جهت ساخت یک لیست مرتب تنها با استفاده از تگ ol قادر به ایجاد چنین لیستی نخواهید بود.

در حقیقت تگ ol تنها تعیین کننده استفاده از لیست مرتب است. و در ابتدای لیست می آید.

لذا اگر قصد دارید آیتم های لیست شمارشی خود را بسازید، بایستی از تگ li استفاده کنید.

تگ li نیز دارای یک تگ باز ( Opening Tag ) و یک تگ بسته ( Closing Tag ) می باشد.

درون تگ li آیتم های لیست قرار می گیرند. این آیتم ها می توانند شامل محتوا ، عکس ، لینک و یا المان های مختلف HTML باشد.

این آیتم ها در لیست مرتب شماره گذاری می شوند.

به مثال زیر توجه کنید:

[html]<ol>
<li><a href=”https://siteamoozi.com”>آیتم اول لیست</a></li>
<li><a href=”https://siteamoozi.com”>آیتم دوم لیست</a></li>
<li><a href=”https://siteamoozi.com”>آیتم سوم لیست</a></li>
</ol>[/html]

نمایش آیتم های لیست مرتب شمارشی فوق در صفحه مرورگر به شکل زیر خواهد بود :

  1. آیتم اول لیست
  2. آیتم دوم لیست
  3. آیتم سوم لیست

پیوندهای مهم و کاربردی

تگ های HTML در سایت آموزی

تگ های جدید HTML5 در سایت آموزی

صفات تگ های HTML در سایت آموزی

تگ های منسوخ شده HTML5 در سایت آموزی

تگ های block level و inline level در سایت آموزی

تگ های HTML در W3school

ویژگی های CSS در سایت آموزی

ویژگی های CSS در W3schools

لیست ها در HTML بخش دوم Ordered Lists لیست شمارشی – اختصاصی سایت آموزی