我一直在尝试使用z-index css属性来使一个元素总是在另一个元素的前面，但它不起作用。一个元素的z-index明显大于另一个元素的z-index，但它仍然位于另一个元素的后面。可能是因为其中一个元素(显示在前面的那个)是iframe吗?还有人有其他建议吗?
对于那些较晚到达这里的人，正确的答案是将position: relative;或任何其他position道具放在有问题的元素上。
我的建议是在涉及到这个问题的每个元素上加上这个:
position: relative;
z-index: 0;
，然后在iframe前面最后面的元素上增加z-index。
如果你这样做，你会很快开始获胜。
在我的测试中，z-index仅在显式设置position时才有效。通过调节z-index值来测试它，然后尝试通过单击鼠标突出显示屏幕上的文本。你应该看到的证据，层的行为要么是预期的，要么是可怕的错误。
我发现它的效果很好，如果你按F12(打开开发窗格，在Chrome中)，然后单击左上角的检查按钮或按CTRL + SHIFT + C。然后你可以把鼠标移到所有元素上，看看它们的堆叠上下文相对于相邻元素是什么。
UX额外提示:记住，用户可能想要复制文本，所以确保他们可以选择它。
如果你有问题，最有可能的是:
- 元素父元素缺少
position: relative;，或者 - 某处缺少
z-index: 0;
请记住，z-index索引只计算绝对元素。两个元素都应该有绝对的位置。更多信息见CSS 2.1规范