将iframe内容定位在所有内容之上

Question

当用户点击页面标题上的链接时，我需要显示iframe。 如何确保iframe始终位于所有内容之上？在这种情况下，CSS z-index不起作用。

Answer 1

z-index可能无效，因为您iframe为not a positioned box：

  

对于定位框，'z-index'属性指定：

     

  
1. 当前堆叠上下文中框的堆栈级别。
  
2. 框是否建立了本地堆叠上下文。
  

将position设置为static以外的其他内容。例如：

iframe#myiframe {
    z-index: 20;
    position: absolute;
}

Answer 2

z-index仅适用于定位的内容。使用 position：absolute; 和top / left / right来定位元素或使用 position：relative; 将元素保留在原来的位置。

任何一个都应该在元素上启用z-index。