Mine põhisisu juurde Jätke dokumentide navigeerimise juurde
Check
in English

Z-indeks

Kuigi z-indeksid ei kuulu Bootstrapi ruudustikusüsteemi, on neil oluline osa meie komponentide kattumisel ja üksteisega suhtlemisel.

Mitmed Bootstrapi komponendid kasutavad z-indexCSS-i atribuuti, mis aitab juhtida paigutust, pakkudes sisu korraldamiseks kolmandat telge. Kasutame Bootstrapis vaikimisi z-indeksi skaalat, mis on loodud navigeerimise, tööriistaspikrite ja hüpikaknate, modaalide ja muu õigeks kihistamiseks.

Need kõrgemad väärtused algavad suvalisest arvust, mis on piisavalt kõrged ja piisavalt spetsiifilised, et ideaalis vältida konflikte. Vajame nende standardset komplekti kõigis oma kihilistes komponentides – tööriistaspikrid, hüpikaknad, navigeerimisribad, rippmenüüd, modaalid –, et saaksime käitumises mõistlikult järjekindlad olla. Pole põhjust, miks me ei oleks saanud kasutada 100+ või 500+.

Me ei julgusta nende individuaalsete väärtuste kohandamist; Kui peaksite ühte muutma, peate tõenäoliselt muutma need kõik.

$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;

Komponentide (nt nupud ja sisendid sisendrühmades) kattuvate ääriste käsitlemiseks kasutame madalaid ühekohalisi z-indexväärtusi 1, 2ja 3vaike-, hõljutus- ja aktiivsete olekute jaoks. Hõljutus-/fookus-/aktiivne-režiimis toome konkreetse elemendi esiplaanile kõrgema z-indexväärtusega, et näidata nende piire õdede elementide kohal.