Z индекс
Хэдийгээр Bootstrap-ийн сүлжээний системийн нэг хэсэг биш ч z-индексүүд нь бидний бүрэлдэхүүн хэсгүүд хоорондоо хэрхэн давхцаж, харилцан үйлчлэхэд чухал үүрэг гүйцэтгэдэг.
Хэд хэдэн Bootstrap бүрэлдэхүүн хэсгүүд нь z-index
агуулгыг зохицуулах гуравдагч тэнхлэгээр хангаснаар зохион байгуулалтыг удирдахад тусалдаг CSS шинж чанарыг ашигладаг. Бид Bootstrap-д навигаци, хэрэгслийн зөвлөмж, поповер, модаль гэх мэтийг зөв давхаргаар тохируулах зориулалттай анхдагч z-индекс масштабыг ашигладаг.
Эдгээр өндөр утгууд нь зөрчилдөөнөөс зайлсхийхэд хангалттай өндөр бөгөөд тодорхой тооноос эхэлдэг. Бидэнд эдгээрийн стандарт иж бүрдэл нь бидний зан үйлийн хувьд нийцтэй байхын тулд зааварчилгаа, popover, navbar, dropdown, modal зэрэг давхаргат бүрэлдэхүүн хэсгүүдэд хэрэгтэй. 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;
Бүрэлдэхүүн хэсгүүдийн давхцаж буй хүрээг зохицуулахын тулд (жишээ нь, оролтын бүлгүүдийн товчлуурууд болон оролтууд) бид , , гэсэн нэг оронтой бага утгуудыг ашигладаг бөгөөд z-index
өгөгдмөл , хулганаа аваач, идэвхтэй төлөвт ашигладаг. Зогсоох/фокус/идэвхтэй үед бид ах дүү элементүүдийн хилийг харуулахын тулд илүү өндөр утгатай тодорхой элементийг тэргүүн эгнээнд авчирдаг .1
2
3
z-index