html - iFrame 页面上显示双垂直滚动条

Question

我有一个包含左右 iFrame 的索引页。由于某种原因，在第二个 iFrame 上它显示了一个滚动条用于它的 iFrame 和另一个滚动条用于整个页面。

我一直在尝试删除整个页面的滚动条，只保留 2 个 iFrame 的滚动条

当我将 body、html 元素的 css 属性更改为溢出隐藏时，它还会删除两个 iFram 的滚动条

我什至尝试将 iFrame 元素 overflow-y: 设置为自动，将 body,html overflow 设置为隐藏。

还是不行。

我遇到的第二个问题是，即使我将高度指定为 100% ，iFrame 也不会一直延伸到页面底部。

我一直在摆弄 CSS，但到目前为止运气不佳。如果有人可以帮助我，我将不胜感激。

下面是我的网页链接和 CSS 片段。谢谢!!!

html,body{ height: 100%; margin:0;padding:0; }
iframe{
    height:100%; margin:0;padding:0; border: 0;
}

http://15c04752.ngrok.com/simplemenu/menus/demo (文本可能在不同的浏览器中呈现得更小，请按键盘上的 ctrl+ cmd+ 以滚动显示)

Answer 1

要删除整个页面的滚动条，请添加此规则:

    body, html {
        overflow: hidden;
    }

要在 iframe 上启用滚动条，请添加此属性:

<iframe ... scrolling="yes"></iframe>

Source

这就是它的样子，如果你同时添加两者:

整个页面没有滚动条，左边iframe没有滚动条(因为内容完全可见)，右边iframe有滚动条(因为内容不完全可见)。如果您缩小窗口，左侧 iframe 的滚动条将会出现。