我有一个iframe，其内容宽度大于我设置的宽度，因此iframe会出现水平滚动条。由于我不能增加iframe的宽度，因此我想删除滚动条。我尝试将scroll属性设置为“no”，但这会同时关闭垂直和水平滚动条，而我只需要垂直滚动条。我尝试将overflow-x设置为“hidden”，这可以在ff中去除水平滚动条，但在IE中无法起作用。对我来说很遗憾。
6个回答
44
scrolling="yes" horizontalscrolling="no" verticalscrolling="yes"
将这放入您的iFrame标签中。
您无需尝试使用CSS格式化此内容。
- ivor biggun
3
1zOMG。虽然horizontal scrolling和vertical scrolling属性在MSDN上似乎没有任何文档，但这个方法解决了我的IE 6问题。 - Simon Lieschke
1非常好的解决方案，正是我在寻找的，非常感谢你。 - David
在IE10上遇到了问题（是的，我们的一些客户仍在使用它），我们在iframe中显示一些自定义的HTML5广告。这个技巧对我们没有起作用... - lkartono
25
滚动条不是 <iframe> 元素的属性，它是该元素所包含页面的属性。尝试在内部页面的 <html> 元素上添加 overflow-x: hidden 属性。
- Jim
3
2这个解决方案更好，因为它使 iframe 代码更轻便，并且支持封装。我不应该需要记住添加和记住语法。 - Danny G
3我同意 @DannyG 的观点。在我们的标记中，演示属性已经过时了。基于纯CSS的解决方案有很多优势。 - DuxPrime
这是一个更好的解决方案，可以让您保持HTML有效。 - Dhaulagiri
5
你可以尝试将 iframe 放在一个 div 中，然后使用该 div 进行滚动。在 IE 中，你可以轻松控制 div 的滚动，而 iframe 滚动则可能会出现问题。以下是一个快速示例，应该能解决问题。
<html>
<head>
<title>iframe test</title>
<style>
#aTest {
width: 120px;
height: 50px;
padding: 0;
border: inset 1px #000;
overflow: auto;
}
#aTest iframe {
width: 100px;
height: 1000px;
border: none;
}
</style>
</head>
<body>
<div id="aTest">
<iframe src="whatever.html" scrolling="no" frameborder="0"></iframe>
</div>
</body>
</html>
- scaryjeff
1
谢谢您提供的解决方案。唯一的问题是，您必须为iframe内容定义一个固定的高度，而在我的情况下，这个高度会有所变化。我将使用这个方法，并不得不为iframe指定一个额外大的高度，这有点hacky。但是非常感谢，这让我成功了。 - mrjrdnthms
0
所有这些解决方案对我来说都没有用或者不够令人满意。使用可滚动的 DIV 可以让水平滚动条消失，但垂直滚动条则总是存在。
因此，在我的网站上，我可以确保控制所有 iframe 的固定高度，以下解决方案非常有效。它只是通过一个 DIV 隐藏了水平滚动条 :)
<!-- This DIV is a special hack to hide the horizontal scrollbar in IE iframes -->
<!--[if IE]>
<div id="ieIframeHorScrollbarHider" style="position:absolute; width: 768px; height: 20px; top: 850px; left: 376px; background-color: black; display: none;">
</div>
<![endif]-->
<script type="text/javascript">
if (document.getElementById("idOfIframe") != null && document.getElementById("ieIframeHorScrollbarHider") != null)
{
document.getElementById("ieIframeHorScrollbarHider").style.display = "block";
}
</script>
- Lou
0
<iframe style="overflow:hidden;" src="about:blank"/>
应该在IE中正常工作。 IE6在支持overflow-x和overflow-y方面存在问题。
另一个需要注意的事项是，如果您使用驼峰命名法设置"frameborder"属性，则可以删除iframe上的IE边框。
<iframe frameBorder="0" style="overflow:hidden;" src="about:blank"/>
如果能够使用CSS进行正确的样式设置将会很好，但在IE中会出现问题。
- scunliffe
1
在我的情况下，我想要移除 x 滚动条，但不是 y 滚动条，我相信设置 overflow:hidden 将会移除两者。我理解正确吗？ - mrjrdnthms
0
您也可以尝试将包含在 iframe 中的页面主体宽度设置为 99%。
- Toby Artisan
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接