Z-indeks

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 – opisi alata, skočni prozori, navigacijske trake, padajući izbornici, modali – 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-modal-backdrop:             1040;
$zindex-offcanvas:                  1050;
$zindex-modal:                      1060;
$zindex-popover:                    1070;
$zindex-tooltip:                    1080;

Za rukovanje preklapajućim granicama unutar komponenti (npr. gumbi i ulazi u grupama unosa), koristimo niske jednoznamenkaste z-indexvrijednosti 1, 2i 3za zadano stanje, lebdenje i aktivno stanje. 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.