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

Twelve Column Grid System نظام الشبكة ذو 12 عموداً

إتقان نظام الشبكة ذي 12 عموداً في بوتستراب 5: تسلسل الحاوية والصف والعمود، الأعمدة المتساوية والرقمية والمتكيفة، الطبقات المتجاوبة، row-cols، وتداخل الشبكات.
2 صفوف تعليمية
بوتستراب 5
2 مشاهدة

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

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

يرتكز تخطيط الصفحات في Bootstrap 5 على نظام شبكة مرن مبني بالكامل بتقنية Flexbox ومقسَّم منطقياً إلى 12 عموداً متساوياً عبر عرض الحاوية. لم يُختر الرقم 12 مصادفة؛ فهو يقبل القسمة بدون باقٍ على 1 و2 و3 و4 و6 و12، ما يتيح لك تقسيم أي صف فوراً إلى عمودين متساويين (6 + 6)، أو ثلاثة أعمدة (4 + 4 + 4)، أو أربعة أعمدة (3 + 3 + 3 + 3)، أو تخطيط غير متماثل مثل محتوى رئيسي وشريط جانبي (8 + 4).

يعتمد النظام فلسفة الهاتف أولاً عبر ست طبقات قياسية تبدأ من الشاشات الصغيرة جداً بلا لاحقة ثم sm وmd وlg وxl وصولاً إلى xxl، بحيث يسري كلاس العرض الأصغر صعوداً على الشاشات الأكبر ما لم يُستبدل بكلاس أعلى.

الصف 2 صورة توضيحية
مخطط معماري يوضح تسلسل الحاوية والصف والأعمدة الاثني عشر في نظام شبكة بوتستراب 5