Z-ინდექსი

Bootstrap-ის რამდენიმე კომპონენტი იყენებს z-indexCSS თვისებას, რომელიც გეხმარებათ განლაგების კონტროლში კონტენტის მოწყობის მესამე ღერძის მიწოდებით. ჩვენ ვიყენებთ ნაგულისხმევ z-ინდექსის სკალას Bootstrap-ში, რომელიც შექმნილია ნავიგაციის, ინსტრუმენტების რჩევების და პოპოვერების, მოდალების და სხვათა სწორად ფენისთვის.

ეს უმაღლესი მნიშვნელობები იწყება თვითნებური რიცხვით, საკმარისად მაღალი და სპეციფიკური, რათა იდეალურად თავიდან აიცილოთ კონფლიქტები. ჩვენ გვჭირდება მათი სტანდარტული ნაკრები ჩვენს ფენოვან კომპონენტებში - ინსტრუმენტების მინიშნებები, popovers, navbars, dropdowns, modals - ასე რომ, ჩვენ შეგვიძლია ვიყოთ გონივრულად თანმიმდევრული ქცევებში. არ არსებობს მიზეზი, რომ ჩვენ ვერ გამოვიყენოთ 100+ ან 500+.

ჩვენ არ ვამხნევებთ ამ ინდივიდუალური ღირებულებების პერსონალიზაციას; თუ ერთს შეცვლით, სავარაუდოდ ყველა უნდა შეცვალოთ.

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

კომპონენტების შიგნით გადახურული საზღვრების დასამუშავებლად (მაგ., ღილაკები და შეყვანები შეყვანის ჯგუფებში), ვიყენებთ დაბალ ერთნიშნა z-indexმნიშვნელობებს 1, 2, და 3ნაგულისხმევად, მავალი და აქტიური მდგომარეობები. Hover/focus/active-ზე ჩვენ ვაყენებთ კონკრეტულ ელემენტს წინა პლანზე უფრო მაღალი z-indexმნიშვნელობით, რათა აჩვენოს მათი საზღვარი და-ძმის ელემენტებზე.