CSS:为什么是“z-index"不让一个 div 出现在另一个 div 之上? [英] CSS: Why is "z-index" not making one div appear on top of another div?

问题描述

索引，我遇到了问题.我有这个按钮，当点击时，它会显示内容但它不会与前面的 div 重叠，如果我也尝试在点击时设置它的 z-index 这里是我的代码到目前为止

index and im having a problem. i have this button that when click, it will show to content but it does not overlap the div in front if it i have also tried to set its z-index on click here is my code so far

<script type="text/javascript">
function change()
{
    alert("Asd");
    $('#account-container').css('z-index', 11);
}

这是它的样子

知道我应该做什么吗?非常感谢

any idea on what i should do? thanks so much

推荐答案

更高的 z-index 是不够的.两个元素都必须定义 position 并且应该是 absolute 和/或 relative.

Higher z-index is not enough. Both elements must have position defined and it should be absolute and / or relative.

我会使用 relative 为父级，absolute 为子级(然后也使用 top/left位置).接下来对两者使用 z-index，其中较高的值用于子元素(或必须位于顶部的层).

I would go with relative for parent and absolute for child (then also use top / left to position). Next play with z-index for both, where higher value is for the child (or the layer that must be on top).

在大多数情况下，z-index 应该与 position 但并非总是.感谢 Michael_B 指出这一点.

In most cases z-index should go together with position but not always. Thanks to Michael_B for pointing that out.

这篇关于CSS:为什么是“z-index"不让一个 div 出现在另一个 div 之上?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！