z-index的表现不如我所期望的

问题描述

所以我有这个大致：

<div id="A">
    <ul>
        <li id="B">foo</li>
    </ul>
</div>
<div id="C">
    ...
</div>

这些位置使B和C重叠。

These are positioned so that B and C overlap.

A的z指数为90，B的z指数为92，C的z指数为91.但C出现在B的前面。我做错了什么？ （如果需要更多细节，请告诉我。）

A has a z-index of 90, B has a z-index of 92, and C has a z-index of 91. But C shows up in front of B. What am i doing wrong? (Let me know if more detail is necessary.)

推荐答案

使用 z-index 仅与同一容器中的元素相关。由于B包含在A里面，B的z-index只适用于解析A里面的其他元素。就C而言，B和A都是在z-index 90上渲染的。但是如果C放在A里面，那么B将呈现在前面。

Using z-index is only relevant for elements in the same container. Since B is contained inside A, B's z-index will only apply when resolving other elements inside A. As far as C is concerned, both B and A are rendered at z-index 90. However if C is placed inside A, then B will render in front.

这篇关于z-index的表现不如我所期望的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！