شرح صفوف ومحتوى الفقرة
تُختتم أدوات النصوص بثلاث مجموعات تفاعلية دقيقة كثيراً ما توفر كتابة أكواد جافاسكريبت إضافية: أولها مجموعة تحديد النص .user-select-all التي تظلل كامل المعرّف أو أمر التثبيت بمجرد نقرة واحدة لتسهيل نسخه، و.user-select-none لمنع تحديد عناصر الواجهة التزيينية بالخطأ أثناء السحب.
وثانيها مجموعة أحداث المؤشر .pe-none لتعطيل استقبال النقرات بالماوس و.pe-auto لاستعادتها، مع ضرورة الانتباه إلى أن pointer-events: none لا يمنع الوصول بزر Tab في لوحة المفاتيح بمفرده! أما المجموعة الثالثة فهي المحاذاة الرأسية السطرية .align-baseline و.align-top و.align-middle و.align-bottom لموازنة الأيقونات والعناصر السطرية بدقة.
| فئة الأداة | أبرز الكلاسات القياسية | الوظيفة الهندسية في Bootstrap 5.3 |
|---|---|---|
| المحاذاة المنطقية | .text-start / .text-center / .text-end | محاذاة متجاوبة تنعكس تلقائياً بين العربية والإنجليزية |
| الالتفاف والقص | .text-wrap / .text-break / .text-truncate | منع فيضان الروابط الطويلة أو قص السطر بثلاث نقاط |
| سلم الخطوط والوزن | .fs-1..6 / .fw-bold / .lh-lg | تحكم بصري مرن في الحجم والسماكة وارتفاع السطر |
| تزيين الروابط | .link-* / .link-offset-1..3 / .link-underline-* | تلوين الروابط وضبط مسافة وشفافية الخط السفلي |
| التحديد والمؤشر | .user-select-all / .pe-none / .align-middle | تظليل النص بنقرة والتحكم في استقبال نقرات الفأرة |
ملخص الدرس
حصاد الدرسمراجعة مركّزة لأهم المفاهيم والقواعد الهندسية التي أتقنتها في هذا الدرس قبل التطبيق العملي
ماذا تعلّمت في هذا الدرس؟
أتقنت في هذا الدرس منظومة أدوات النصوص والروابط في بوتستراب 5.3، بدءاً من المحاذاة المنطقية المتكيفة مع العربية، ومنع فيضان النصوص أو قصها بالنقاط، وضبط سلم الخطوط وأوزانها، وصولاً إلى تلوين الروابط وبُعد خطها السفلي وأدوات التحديد والمؤشر. الخطوة التالية: انتقل الآن إلى الدرس الحادي والعشرين لاستكشاف المساعدات البصرية وأدوات الإتاحة مثل نسب أبعاد الفيديو والرابط الممتد وبناء أقسام الواجهة الترحيبية الحديثة.