iframe - 当 iframe 包含 PDF 时，菜单项隐藏在 iframe 后面

Question

我正在使用 iframe 来显示 pdf(asp.net mvc3)。虽然 PDF 在 iframe 菜单项中不可见，意味着它隐藏在 iframe 后面。 谁能告诉我如何解决这个问题。

提前致谢。

Answer 1

你的问题很简单，请详细说明。

但是，这里有一个解决方案:

在 CSS 中使用 z-index。

给 iFrame 一个 ID，如下所示:

<iframe id="pdf-display"></iframe>

还以类似的方式为菜单项提供 ID，例如 id="menu-item" 。如果您有多个其他菜单项，请将它们包含在 <div> 中并给div一个ID。

然后，在单独的样式表或 <style> 中标签，输入此代码:

iframe#pdf-display {
    position: relative;
    z-index: 9;
}

#menu-item {
    position: relative;
    z-index: 10;
}

通过将菜单项的 z-index 加一，可以将元素放置在 iFrame“上方”。 z-index 越高，元素越靠近“前面”。