📌 خاصیت list-style-position تعیین می‌کنه که bullet (یا شماره لیست) داخل متن قرار بگیره یا بیرون.

در Tailwind دو کلاس اصلی براش داریم:

✅ کلاس‌ها

• list-inside → bullet داخل متن قرار می‌گیره.

• list-outside → bullet بیرون متن قرار می‌گیره (پیش‌فرض مرورگر).

✅ مثال ساده

<h2 class="font-bold mb-2">list-outside (پیش‌فرض)h2>
<ul class="list-disc list-outside pl-5">
  <li>HTMLli>
  <li>CSSli>
  <li>JavaScriptli>
ul>

<h2 class="font-bold mt-6 mb-2">list-insideh2>
<ul class="list-decimal list-inside">
  <li>HTML و زبان نشانه‌گذاری وبli>
  <li>CSS برای طراحی ظاهرli>
  <li>JavaScript برای تعاملli>
ul>

📌 توضیح

• list-disc → نوع marker رو مشخص می‌کنه (دایره توپر).

• list-decimal → نوع marker عددی.

• list-inside → اگه متن طولانی باشه، خط دوم درست زیر bullet قرار می‌گیره.

• list-outside → متن تورفتگی بیشتری داره و bullet بیرون متن می‌مونه.

🎯 جمع‌بندی

• Tailwind کلاس آماده برای list position داره:

  • list-inside

  • list-outside

• به همراه list-disc, list-decimal, یا list-none استفاده میشه.