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

Numeric Column Widths تحديد عرض الأعمدة بالأرقام

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

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

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

لتخصيص نسب عرض دقيقة ومحددة مسبقاً من أصل 12 وحدة، استخدم الكلاسات الرقمية .col-1 حتى .col-12، حيث يساوي كل رقم واحداً من اثني عشر جزءاً من عرض الصف (نحو 8.333% للوحدة الواحدة). كما يمكنك دمج عمود رقمي محدد مثل .col-6 في المنتصف مع عمودين مرنين بكلاس .col على الجانبين ليتقاسما المساحة المتبقية تلقائياً.

الصف 2 كود برمجي
HTML
<div class="row">
  <div class="col-8">Main (col-8)</div>
  <div class="col-4">Sidebar (col-4)</div>
</div>
<div class="row">
  <div class="col">Auto</div>
  <div class="col-6">Fixed Center (col-6)</div>
  <div class="col">Auto</div>
</div>
الصف 3 ملاحظة هامة