انتقل إلى محتوى الدرس

Arabic Fonts Integration دمج الخطوط العربية

فعّل الدعم الأصيل للغة العربية RTL في Bootstrap 5.3 عبر dir="rtl" وملف bootstrap.rtl.min.css، وأتقن الاتجاهات المنطقية start وend ودمج الخطوط العربية وعزل BiDi.
3 صفوف تعليمية
بوتستراب 5
0 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تبدو حزمة خطوط النظام الافتراضية في بوتستراب أنيقة مع الحروف اللاتينية، لكن الخط العربي البديل الافتراضي قد يظهر صغير الحجم أو متفاوت السماكة بين أنظمة التشغيل المختلفة. يمكنك دمج خط ويب عربي هندسي واضح مثل Cairo أو Tajawal أو IBM Plex Sans Arabic على مستوى المشروع كله في سطر واحد فقط عبر تخصيص متغير الجذر --bs-body-font-family.

الصف 2 كود برمجي
HTML
<style>
  :root {
    --bs-body-font-family: 'Cairo', system-ui, sans-serif;
    --bs-body-line-height: 1.7;
  }
</style>
<div class="container">
  <h2>Custom Typography via --bs-body-font-family</h2>
</div>
الصف 3 ملاحظة هامة