📌 این ویژگی مشخص می‌کنه که ضخامت حاشیه (border) یک عنصر چقدر باشد.
در Tailwind از کلاس‌های border, border-{side}, border-{width} استفاده می‌کنیم.

✅ کلاس‌ها

تعیین ضخامت کلی

• border → ضخامت پیش‌فرض 1px

• border-0 → بدون حاشیه

• border-2 → ضخامت 2px

• border-4 → ضخامت 4px

• border-8 → ضخامت 8px

تعیین ضخامت برای یک طرف خاص

• border-t → فقط بالا

• border-b → فقط پایین

• border-l → فقط چپ

• border-r → فقط راست

تعیین ضخامت یک طرف خاص

• border-t-2, border-b-4, …

✅ مثال

<div class="w-32 h-16 border border-black mb-2">
  حاشیه 1px
</div>

<div class="w-32 h-16 border-4 border-red-500 mb-2">
  حاشیه 4px قرمز
</div>

<div class="w-32 h-16 border-t-8 border-green-500 mb-2">
  فقط حاشیه بالایی 8px
</div>

<div class="w-32 h-16 border-b-2 border-blue-500 mb-2">
  فقط حاشیه پایینی 2px
</div>

📌 نکات مهم

• ضخامت حاشیه با responsive هم قابل ترکیب است:

  • sm:border-2 md:border-4 → موبایل 2px، دسکتاپ 4px

• اغلب همراه با border-color و border-style استفاده می‌شود.