انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #4 من درس: مؤشرات التحميل في بوتستراب 5

Aligning Loading Spinners توسيط ومحاذاة المؤشرات

تعلّم بناء مؤشرات التحميل الحلقي والنابض في بوتستراب 5.3 بـ CSS الخالص، وتلوينها بكلاسات النصوص، ومحاذاة أحجامها، ودمجها داخل أزرار الإرسال المعطلة مؤقتاً.
2 صفوف تعليمية
بوتستراب 5
0 مشاهدة

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

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

تُبنى المؤشرات في بوتستراب بخاصية display: inline-block حتى يسهل دمجها بجانب النصوص والأزرار، وبفضل ذلك يمكنك توسيطها أو محاذاتها في منتصف البطاقات والأقسام فوراً باستخدام حاويات Flexbox مثل .d-flex .justify-content-center، أو محاذاة النصوص .text-center، أو الهوامش .m-4.

الصف 2 كود برمجي
HTML 
<div class="d-flex align-items-center p-3 border rounded">
  <strong role="status">Fetching cluster metrics...</strong>
  <div class="spinner-border text-primary ms-auto"
    aria-hidden="true"></div>
</div>
جرّب بنفسك

جميع فقرات هذا الدرس (مؤشرات التحميل في بوتستراب 5)