Z-index
ໃນຂະນະທີ່ບໍ່ແມ່ນສ່ວນຫນຶ່ງຂອງລະບົບຕາຂ່າຍໄຟຟ້າຂອງ Bootstrap, z-indexes ມີບົດບາດສໍາຄັນໃນວິທີທີ່ອົງປະກອບຂອງພວກເຮົາວາງຊ້ອນກັນແລະພົວພັນກັບກັນແລະກັນ.
ອົງປະກອບ Bootstrap ຫຼາຍໆອັນໃຊ້ z-index
, ຄຸນສົມບັດ CSS ທີ່ຊ່ວຍຄວບຄຸມການຈັດວາງໂດຍການສະຫນອງແກນທີສາມເພື່ອຈັດແຈງເນື້ອຫາ. ພວກເຮົາໃຊ້ຂະຫນາດ z-index ເລີ່ມຕົ້ນໃນ Bootstrap ທີ່ຖືກອອກແບບເພື່ອການນໍາທາງຊັ້ນ, ຄໍາແນະນໍາແລະ popovers, modals, ແລະອື່ນໆຢ່າງຖືກຕ້ອງ.
ຄຸນຄ່າທີ່ສູງກວ່າເຫຼົ່ານີ້ເລີ່ມຕົ້ນດ້ວຍຕົວເລກທີ່ມັກ, ສູງ ແລະສະເພາະພໍທີ່ຈະຫຼີກລ່ຽງການຂັດແຍ້ງກັນໄດ້. ພວກເຮົາຕ້ອງການຊຸດມາດຕະຖານເຫຼົ່ານີ້ໃນທົ່ວອົງປະກອບຊັ້ນຂອງພວກເຮົາ - ຄໍາແນະນໍາເຄື່ອງມື, popovers, navbars, dropdowns, modals - ດັ່ງນັ້ນພວກເຮົາສາມາດສອດຄ່ອງຢ່າງສົມເຫດສົມຜົນໃນພຶດຕິກໍາ. ບໍ່ມີເຫດຜົນທີ່ພວກເຮົາບໍ່ສາມາດໃຊ້ 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
ສໍາລັບຄ່າເລີ່ມຕົ້ນ, ເລື່ອນ ແລະສະຖານະທີ່ເຄື່ອນໄຫວ. ເມື່ອ hover/focus/active, ພວກເຮົາເອົາອົງປະກອບສະເພາະອັນໃດອັນໜຶ່ງມາຢູ່ແຖວໜ້າດ້ວຍ z-index
ມູນຄ່າທີ່ສູງກວ່າເພື່ອສະແດງຂອບຂອງເຂົາເຈົ້າຕໍ່ກັບອົງປະກອບຂອງພີ່ນ້ອງ.