固定容器中绝对容器上的Z索引

Question

enter image description here

enter image description here

header{
        position:fixed;
        top:0;
        left:0;
        background-color: $color;
        width: $width;
        height: 56px;
    }

.utility{
        @include lockPosition(10px);
        right:10px;
        width:700px;
        height:20px;
        padding-top:10px;
        z-index:1000;
        position:absolute;
    }

我发现只有绝对位置才能解决我遇到的z-index问题，但我希望将标头固定以便滚动。有没有办法在固定元素中具有绝对位置而不影响z-index？

Answer 1

我认为最简单的方法是将箱子推到绝对位置，我猜是在.utility上

.utility{top: npx}

关于您的问题，z-index的重要性取决于您放置HTML DOM的方式，例如

<header>Your fixed position</header>
<main>
 <nav>Your absolute position</nav>
</main>

固定位置的z-index比您的

重要得多

希望有帮助，