Z-ಸೂಚ್ಯಂಕ

ಹಲವಾರು ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್ ಘಟಕಗಳು ಬಳಸುತ್ತವೆ z-index, CSS ಪ್ರಾಪರ್ಟಿಯು ವಿಷಯವನ್ನು ಜೋಡಿಸಲು ಮೂರನೇ ಅಕ್ಷವನ್ನು ಒದಗಿಸುವ ಮೂಲಕ ವಿನ್ಯಾಸವನ್ನು ನಿಯಂತ್ರಿಸಲು ಸಹಾಯ ಮಾಡುತ್ತದೆ. ನಾವು ಬೂಟ್‌ಸ್ಟ್ರ್ಯಾಪ್‌ನಲ್ಲಿ ಡೀಫಾಲ್ಟ್ z-ಇಂಡೆಕ್ಸ್ ಸ್ಕೇಲ್ ಅನ್ನು ಬಳಸುತ್ತೇವೆ ಅದನ್ನು ಸರಿಯಾಗಿ ಲೇಯರ್ ನ್ಯಾವಿಗೇಶನ್, ಟೂಲ್‌ಟಿಪ್‌ಗಳು ಮತ್ತು ಪಾಪೋವರ್‌ಗಳು, ಮಾದರಿಗಳು ಮತ್ತು ಹೆಚ್ಚಿನವುಗಳಿಗೆ ವಿನ್ಯಾಸಗೊಳಿಸಲಾಗಿದೆ.

ಈ ಹೆಚ್ಚಿನ ಮೌಲ್ಯಗಳು ಅನಿಯಂತ್ರಿತ ಸಂಖ್ಯೆಯಲ್ಲಿ ಪ್ರಾರಂಭವಾಗುತ್ತವೆ, ಘರ್ಷಣೆಗಳನ್ನು ಆದರ್ಶವಾಗಿ ತಪ್ಪಿಸಲು ಸಾಕಷ್ಟು ಹೆಚ್ಚು ಮತ್ತು ನಿರ್ದಿಷ್ಟವಾಗಿರುತ್ತವೆ. ನಮ್ಮ ಲೇಯರ್ಡ್ ಕಾಂಪೊನೆಂಟ್‌ಗಳಲ್ಲಿ ನಮಗೆ ಇವುಗಳ ಪ್ರಮಾಣಿತ ಸೆಟ್ ಅಗತ್ಯವಿದೆ-ಟೂಲ್‌ಟಿಪ್‌ಗಳು, ಪಾಪೋವರ್‌ಗಳು, ನ್ಯಾವ್‌ಬಾರ್‌ಗಳು, ಡ್ರಾಪ್‌ಡೌನ್‌ಗಳು, ಮಾದರಿಗಳು-ಆದ್ದರಿಂದ ನಾವು ನಡವಳಿಕೆಗಳಲ್ಲಿ ಸಮಂಜಸವಾಗಿ ಸ್ಥಿರವಾಗಿರಬಹುದು. 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ಮೌಲ್ಯಗಳನ್ನು ಬಳಸುತ್ತೇವೆ. ಹೋವರ್/ಫೋಕಸ್/ಆಕ್ಟಿವ್‌ನಲ್ಲಿ , ಸಹೋದರ ಅಂಶಗಳ ಮೇಲೆ ಅವುಗಳ ಗಡಿಯನ್ನು ತೋರಿಸಲು ನಾವು ಹೆಚ್ಚಿನ ಮೌಲ್ಯದೊಂದಿಗೆ ನಿರ್ದಿಷ್ಟ ಅಂಶವನ್ನು ಮುಂಚೂಣಿಗೆ ತರುತ್ತೇವೆ .123z-index