জেড-সূচক

বেশ কিছু বুটস্ট্র্যাপ উপাদান ব্যবহার করে 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;
$zindex-toast:                      1090;

উপাদানগুলির মধ্যে ওভারল্যাপিং সীমানাগুলি পরিচালনা করতে (যেমন, ইনপুট গোষ্ঠীতে বোতাম এবং ইনপুট), আমরা , , এবং ডিফল্ট, হোভার এবং সক্রিয় অবস্থার জন্য কম একক সংখ্যার z-indexমান ব্যবহার করি। হোভার/ফোকাস/অ্যাক্টিভ-এ, আমরা একটি নির্দিষ্ট উপাদানকে সামনের দিকে নিয়ে আসি যাতে ভাইবোন উপাদানের উপর তাদের সীমানা দেখানো হয়।123z-index