Z-index
Bagama't hindi bahagi ng sistema ng grid ng Bootstrap, ang mga z-index ay may mahalagang bahagi sa kung paano nag-o-overlay at nakikipag-ugnayan ang aming mga bahagi sa isa't isa.
Ginagamit ng ilang bahagi ng Bootstrap z-indexang , ang CSS property na tumutulong sa pagkontrol ng layout sa pamamagitan ng pagbibigay ng ikatlong axis upang ayusin ang nilalaman. Gumagamit kami ng default na z-index scale sa Bootstrap na idinisenyo upang maayos na i-layer ang navigation, tooltips at popover, modals, at higit pa.
Ang mas matataas na halagang ito ay nagsisimula sa isang di-makatwirang numero, mataas at sapat na partikular upang perpektong maiwasan ang mga salungatan. Kailangan namin ng karaniwang hanay ng mga ito sa aming mga layered na bahagi—mga tooltip, popover, navbar, dropdown, modals—upang makatuwirang maging pare-pareho tayo sa mga gawi. Walang dahilan kung bakit hindi namin ginamit ang 100+ o 500+.
Hindi namin hinihikayat ang pag-customize ng mga indibidwal na halagang ito; kung magpalit ka ng isa, malamang na kailangan mong baguhin ang lahat.
$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;
Upang pangasiwaan ang mga magkakapatong na hangganan sa loob ng mga bahagi (hal., mga button at input sa mga pangkat ng input), gumagamit kami ng mababang solong digit z-indexna halaga ng 1, 2, at 3para sa default, hover, at mga aktibong estado. Sa hover/focus/active, dinadala namin ang isang partikular na elemento sa unahan na may mas mataas z-indexna halaga upang ipakita ang kanilang hangganan sa mga elemento ng magkakapatid.