把元素放在别人面前...... z-index？

Question

我刚刚在我的网站上添加了一个浮动导航菜单。

问题是该页面的某些图像仍然存在

我试过

z-index: 99999;

但它没有改变任何东西。

查看测试页面以查看实时问题（向下滚动页面，您会看到） https://www.ni-dieu-ni-maitre.com/index2.php

Answer 1

如果您想使用z-index，必须在css中使用'position'。使用以下之一：

position: relative;
position: absolute;
position: fixed;

Answer 2

移动WebKit和Chrome 22+，即使position: fixed为z-index，auto也会创建新的堆叠上下文。

所以堆叠上下文层次结构如下所示：

• 文档根目录（z-index 0）
  • #element（z-index 9998）
  • #element2（z-index 0）
    • .aboveElement（z-index 9999）
    • .belowElement（z-index 9997）

您无法将9998与9999或9997进行比较以确定堆叠顺序。相反，9999与9997进行比较，以确定.aboveElement和.belowElement中的哪一个位于前方，然后#element2内的所有内容都堆叠在该上下文中，它被视为z-index 0的单个图层，在z-index #element处堆叠在9998后面。

阅读the stacking context in mozilla

阅读the stacking change for fixed elements in Chrome。