Z-indeks
Iako nisu dio Bootstrapovog mrežnog sustava, z-indeksi igraju važnu ulogu u tome kako se naše komponente preklapaju i međusobno djeluju.
Nekoliko komponenti Bootstrapa koristi z-indexCSS svojstvo koje pomaže u kontroli izgleda pružajući treću os za raspoređivanje sadržaja. Koristimo zadanu ljestvicu z-indeksa u Bootstrapu koja je dizajnirana za ispravnu slojevitu navigaciju, opise alata i skočne prozore, modale i još mnogo toga.
Te više vrijednosti počinju od proizvoljnog broja, dovoljno visokog i specifičnog da idealno izbjegne sukobe. Potreban nam je standardni skup istih u našim slojevitim komponentama—opisima, skočnim prozorima, navigacijskim trakama, padajućim menijima, modalima—kako bismo mogli biti razumno dosljedni u ponašanju. Nema razloga da ne upotrijebimo 100+ ili 500+.
Ne potičemo prilagodbu ovih pojedinačnih vrijednosti; ako promijenite jedan, vjerojatno ćete ih morati promijeniti sve.
$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;
Za rukovanje preklapajućim granicama unutar komponenti (npr. gumbi i ulazi u grupama unosa), koristimo niske jednoznamenkaste z-indexvrijednosti 1, 2i 3za zadana stanja, lebdenje i aktivna stanja. Pri lebdenju/fokusu/aktivnosti stavljamo određeni element u prvi plan s višom z-indexvrijednošću kako bismo prikazali njegovu granicu iznad srodnih elemenata.