شرح صفوف ومحتوى الفقرة
نادراً ما تخلو واجهة عربية حقيقية من مقاطع إنجليزية أو رموز تقنية مدمجة وسط السطر مثل عناوين الروابط، ومسارات الملفات، وأكواد البرمجة، والبريد الإلكتروني، والأرقام القياسية 0-9. من دون تطبيق عزل النصوص ثنائية الاتجاه BiDi قد تنقلب مواضع الشرطة المائلة أو النقطتين الرأسيتين أو إشارة السالب:
- أحط مسارات الملفات والأكواد وأرقام الهواتف الدولية بعنصر يحمل السمة
dir="ltr"لضمان قراءتها من اليسار لليمين دون تشوه. - غلّف المعرفات الديناميكية وأسماء الحسابات المختلطة بوسم العزل الدلالي
<bdi>لحماية علامات الترقيم العربية المحيطة بها.
<div class="container">
<p>Endpoint: <span dir="ltr">/api/v2/users</span></p>
<p>Support: <span dir="ltr">+966 11 555 0199</span></p>
<p>Account: <bdi>dev_ahmed_99</bdi></p>
</div>| الجانب الهندسي | الوضع اليساري القياسي LTR | الوضع العربي اليميني RTL | القاعدة العملية المعتمدة |
|---|---|---|---|
| سمات الوسم الجذري | lang="en" dir="ltr" | lang="ar" dir="rtl" | تحديد اللغة والاتجاه معاً على عنصر <html> |
| ملف التنسيق المعتمد | bootstrap.min.css | bootstrap.rtl.min.css | ربط ملف واحد فقط حسب اللغة وعدم الجمع بينهما |
| حزمة السكريبت التفاعلي | bootstrap.bundle.min.js | bootstrap.bundle.min.js | نفس الملف يتعرف تلقائياً على اتجاه المستند |
معنى البداية start | الحافة اليسرى للشاشة | الحافة اليمنى للشاشة | بناء التخطيط بالاتجاهات المنطقية دائماً |
| المسارات والأكواد المدمجة | تتدفق طبيعياً من اليسار | تُعزل عبر dir="ltr" أو <bdi> | حماية الرموز البرمجية والأرقام من الانعكاس |
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
تعرفت في هذا الدرس على الدعم الأصيل للغة العربية في Bootstrap 5 عبر محرك RTLCSS، وتفعيل سمتي lang="ar" و dir="rtl" مع ملف bootstrap.rtl.min.css، وفلسفة البداية والنهاية المنطقية، ودمج الخطوط العربية بمتغير --bs-body-font-family، وضوابط عزل النصوص ثنائية الاتجاه. الخطوة التالية: انتقل الآن إلى الدرس الرابع «التطبيع القياسي Reboot في بوتستراب 5» لاكتشاف القواعد التأسيسية التي يطبقها الإطار تلقائياً على عناصر الصفحة.