iframe 内容与 iframe 的边界重叠

Question

我有一个特定高度的header。在其中，我想要 place/load 一个包含 drop-down 菜单的外部 html 文件。

<head>
    <style>
        header {
            height: 30px;
        }
    </style>
</head>

<body>
    <header>
        <iframe src="dropDownMenu.html"></iframe>
    </header>
    <main>[...]</main>
    <footer>[...]</footer>
</body>

问题是 dropped-down 项没有超过 iframe 本身，也没有超过 header（肯定是因为 header 和 header 中的特定高度iframe 边界本身）。

我已经尝试在 z-index 中为 iframe 和外部菜单文件本身使用大数字，但没有结果。我也尝试过 embed 和 object。

iframe 内容可能会与 iframe 的边界重叠。如果是这样，是否可以仅使用 HTML/CSS 来完成？

Answer 1

在使用 z-index 之前，您是否使用了 CSS 位置。因为如果没有，那么就不是真正有效，因为它需要 CSS 位置。

有关 CSS 职位的更多信息，您可以查看此 link。 https://www.w3schools.com/cssref/pr_class_position.asp

iframe 内容与 iframe 的边界重叠

iframe content overlapping the iframe’s boundaries

html

css

embed

iframe

object