📌 این ویژگی مشخص می‌کنه که سبک خط حاشیه بیرونی (outline) یک عنصر چگونه باشد.
در Tailwind از کلاس‌های outline-{style} استفاده می‌کنیم.

✅ کلاس‌ها

• outline-solid → خط ساده و پیوسته (default)

• outline-dashed → خط خط‌چین

• outline-dotted → خط نقطه‌نقطه

• outline-double → خط دوگانه

• outline-none → بدون خط حاشیه

📌 اغلب همراه با outline-width و outline-color استفاده می‌شود.

✅ مثال

<button class="outline outline-black outline-solid p-2 mb-2">
  Outline ساده
</button>

<button class="outline-2 outline-red-500 outline-dashed p-2 mb-2">
  Outline خط‌چین
</button>

<button class="outline-4 outline-green-500 outline-dotted p-2 mb-2">
  Outline نقطه‌نقطه
</button>

<button class="outline-4 outline-blue-500 outline-double p-2 mb-2">
  Outline دوگانه
</button>

<button class="outline-none p-2 mb-2">
  بدون Outline
</button>

📌 نکات مهم

• Outline Style همیشه با outline-width و outline-color ترکیب می‌شود تا ظاهر کامل مشخص شود.

• می‌توان با responsive ترکیب کرد:

  • sm:outline-dashed md:outline-solid → موبایل خط‌چین، دسکتاپ ساده