Перайсці да асноўнага зместу Перайсці да навігацыі па дакументах
Check
in English

Z-індэкс

Нягледзячы на ​​тое, што z-індэксы не ўваходзяць у сеткавую сістэму Bootstrap, яны гуляюць важную ролю ў тым, як нашы кампаненты накладваюцца і ўзаемадзейнічаюць адзін з адным.

Некалькі кампанентаў Bootstrap выкарыстоўваюць z-indexуласцівасць CSS, якая дапамагае кантраляваць макет, забяспечваючы трэцюю вось для размяшчэння змесціва. Мы выкарыстоўваем шкалу z-індэксу па змаўчанні ў Bootstrap, якая была распрацавана для правільнай навігацыі па пластах, усплывальных падказак і ўсплывальных вобразаў, мадалаў і іншага.

Гэтыя больш высокія значэнні пачынаюцца з адвольнага ліку, дастаткова высокага і канкрэтнага, каб ідэальна пазбегнуць канфліктаў. Нам патрэбны стандартны набор для нашых шматслойных кампанентаў — падказкі, усплывальныя вобразы, панэлі навігацыі, выпадальныя спісы, мадальныя — каб мы маглі быць дастаткова паслядоўнымі ў паводзінах. Няма прычын, па якіх мы не маглі выкарыстоўваць 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для станаў па змаўчанні, навядзення і актыўных станаў. Пры навядзенні/факусіроўцы/актыўнасці мы вылучаем пэўны элемент на першы план з больш высокім z-indexзначэннем, каб паказаць яго мяжу над роднаснымі элементамі.