HTML iframe-双滚动条

我设置了一个iframe，如下所示

<iframe src="http://www.bbc.com/" frameborder="0" width="100%"></iframe>

出现2个水平滚动条，1个位于iframe，另一个位于浏览器

我想摆脱iframe的酒吧，我试着

<iframe src="yahoo.com" scrolling="no" frameborder="0" width="100%"></iframe>

然后iframe上的滚动条消失了，问题是我在BBC网站的底部看不到任何东西

我可以将

min height

增加到更大的数字，以覆盖整个BBC页面，但有时页面很短，我会在底部看到一个巨大的空白！因此，增加

最小高度

不是一个好的做法

如何删除iframe上的滚动条并使用浏览器的滚动条上下导航页面

---

谢谢大家!

有不同的方法可以做到这一点。还有jQuery解决方案。这将帮助您开始：

演示： CSS

HTML

我使用javascript设置iframe的高度。非常感谢，Tony！您能详细解释一下如何使用javascript设置iframe的高度吗？

var h=window.innerHeight | document.documentElement.clientHight | document.body.clientHight；document.getElementById（“myIframe”）.style.height=（h-200）+“px”

ps.200是iframe.BootstrapTheme中不包含的高度，非常感谢您的帮助！看起来很神奇，iframe的滚动条不见了！我想知道为什么我们需要

.embed container object

和

.embed container embed

？我没有在代码中看到

对象

和

嵌入

。谢谢如果你用了，如果你没有用，就把它拿走。如果你觉得这个答案很有用，就选择它。嗨，BootstrapTheme，我试过了，效果很好。但是，如果我再添加两个

s

，一个在顶部，另一个在左侧，那么iframe上的scrooling栏就会出现！[你有什么想法吗？当然有，宽度和高度都是视图端口的100%，如果其他东西占用了该空间，那么iframe的容器需要有负边距或其他东西，例如jQuery。要做的事情是用相同的代码和jSBin或Fiddle生成一个新问题。谢谢你，BoostrapTheme！我打开了一个新的问题位于[。请看一看。欢迎使用StackOverflow。虽然您的代码片段可以回答这个问题，但提供有关代码片段为什么和/或如何工作的其他上下文可以提高其长期价值。

<iframe src="yahoo.com" scrolling="no" frameborder="0" width="100%"></iframe>

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

html {overflow-y:auto}

.embed-container {
    position: relative;
    height: 100%;
    max-width: 100%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

<div class='embed-container'><iframe src='http://www.bbc.com/' style='border:0'></iframe></div>