Z-index

尽管z-indexes不是Bootstrap网格系统的一部分，但它在我们的组件如何相互覆盖和交互起着非常重要的作用。

一些Bootstrap组件利用z-index这个CSS属性，它通过提供第三个axis轴来安排内容来帮助控制布局。 我们在Bootstrap中使用默认的z-index尺度，它被设计成可适当地分层导航、工具提示和弹出窗口、模式等。

这些较高的值以任意数字开始，该数字足够高且特定，足以避免冲突。 我们需要在我们的分层组件（工具提示，弹出窗口，导航栏，下拉菜单，模态控件）中使用一组标准的工具，以便我们在行为上可以合理地保持一致。 没有理由我们不使用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;

为了处理组件内的重叠边框（例如输入组中的buttons和inputs），我们使用低个位数的z-index值分别为默认状态，悬停状态和活动状态，分别为1、2和3。 在悬停/焦点/活动(hover/focus/active)时，我们将具有更高z-index值的特定元素带到最前沿，以显示它们在同级元素上的边框。