مؤشر Z

تستخدم العديد من مكونات Bootstrap z-index، خاصية CSS التي تساعد في التحكم في التخطيط من خلال توفير محور ثالث لترتيب المحتوى. نحن نستخدم مقياس z-index افتراضيًا في Bootstrap تم تصميمه للتنقل في الطبقات وتلميحات الأدوات والأدوات المنبثقة والنماذج النمطية وغير ذلك بشكل صحيح.

تبدأ هذه القيم الأعلى برقم عشوائي ، مرتفع ومحدّد بما يكفي لتفادي التعارضات بشكل مثالي. نحن بحاجة إلى مجموعة قياسية من هذه عبر مكوناتنا ذات الطبقات - تلميحات الأدوات ، popovers ، navbars ، القوائم المنسدلة ، النماذج - حتى نتمكن من الاتساق بشكل معقول في السلوكيات. لا يوجد سبب يمنعنا من استخدام 100+ أو 500+.

نحن لا نشجع على تخصيص هذه القيم الفردية ؛ إذا قمت بتغيير واحدة ، فمن المحتمل أن تحتاج إلى تغييرها جميعًا.

$zindex-dropdown:                   1000;
$zindex-sticky:                     1020;
$zindex-fixed:                      1030;
$zindex-modal-backdrop:             1040;
$zindex-offcanvas:                  1050;
$zindex-modal:                      1060;
$zindex-popover:                    1070;
$zindex-tooltip:                    1080;

للتعامل مع الحدود المتداخلة داخل المكونات (على سبيل المثال ، الأزرار والمدخلات في مجموعات الإدخال) ، نستخدم z-indexقيمًا منخفضة من رقم واحد للحالات الافتراضية 1، وتحوم 2، 3والحالات النشطة. في التمرير / التركيز / النشط ، نضع عنصرًا معينًا في المقدمة z-indexبقيمة أعلى لإظهار حدوده على العناصر الأشقاء.