أدوات للتخطيط

من أجل تطوير سريع وسريع الاستجابة للجوال ، يتضمن Bootstrap عشرات من فئات الأدوات لعرض المحتوى وإخفائه ومحاذاة وتباعد المحتوى.

التغييرdisplay

استخدم أدوات العرض الخاصة بنا لتبديل القيم المشتركة displayللممتلكات بشكل سريع الاستجابة. امزجها مع نظام الشبكة أو المحتوى أو المكونات الخاصة بنا لإظهارها أو إخفائها عبر إطارات عرض محددة.

خيارات Flexbox

تم تصميم Bootstrap 4 باستخدام flexbox ، ولكن لم displayيتم تغيير كل عنصر إلى display: flexحيث أن هذا من شأنه أن يضيف العديد من التجاوزات غير الضرورية ويغير سلوكيات المتصفح الرئيسية بشكل غير متوقع. تم بناء معظم مكوناتنا مع تمكين flexbox.

إذا احتجت إلى إضافة display: flexعنصر ، فافعل ذلك باستخدام .d-flexأو أحد المتغيرات سريعة الاستجابة (على سبيل المثال ، .d-sm-flex). ستحتاج إلى هذه الفئة أو displayالقيمة للسماح باستخدام أدوات Flexbox الإضافية الخاصة بنا للتحجيم والمحاذاة والتباعد والمزيد.

الهامش والحشو

استخدم أدوات التباعد والتباعدmargin للتحكم في كيفية تباعد العناصر والمكونات وحجمها. يتضمن Bootstrap 4 مقياسًا من خمسة مستويات لأدوات التباعد ، استنادًا إلى متغير افتراضي للقيمة . اختر قيمًا لجميع إطارات العرض (على سبيل المثال ، لـ ) ، أو اختر متغيرات سريعة الاستجابة لاستهداف إطارات عرض معينة ( على سبيل المثال ، للبدء عند نقطة التوقف).padding 1rem$spacer.mr-3margin-right: 1rem.mr-md-3margin-right: 1remmd

تبديلvisibility

عندما displayلا تكون هناك حاجة إلى التبديل ، يمكنك تبديل visibilityعنصر باستخدام أدوات الرؤية الخاصة بنا . ستظل العناصر غير المرئية تؤثر على تخطيط الصفحة ، ولكنها مخفية بصريًا عن الزائرين.