Question

我遇到了经典问题，我的标题导航栏正在我体内的iframe下面，但是我用z-index解决这个问题的尝试让我更加困惑，仍然遇到同样的问题：/ 这是我的设置：

<header style="z-index:2;">
....code....
<nav align="center" style="z-index:2;">
....nav....
</nav>
</header>
<section id="content" style="z-index:-1;">
<div class="block">
    <div class="main">
    <!--[if IE]>
<div style="z-index:-2;">
<iframe width="900" height="900" style="position:relative; z-index:-2;" src="http://www.flytheflagtexas.com/athens/magazine/latest/index.html" ></iframe>
</div>
<![endif]-->
....code....

为什么z-index：-2 iframe出现在任何东西之下？以下是页面：http://www.flytheflagtexas.com/athens/latest随时可以查看代码

Answer 1

z-index仅在您已用于布置组件的已用位置时才有效。否则它就行不通。这意味着z-index适用于：定位元素

Answer 2

试试这个：

#nav{position:relative; z-index:2;}

和框架

#content{position:relative;}

您不需要为底部元素提供z-index值，但您可以将其设置为小于2。

Answer 3

Z-index仅在您使用

时可靠地运行

position: relative;

或

position: absolute;

如果您未将CSS中的位置设置为支持的值之一，则z-index不会产生任何影响。

IE Z-Index问题

3 个答案: