Html 从 iframe 中删除滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10082155/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove scrollbar from iframe
提问by Faith In Unseen Things
Using this code
使用此代码
<iframe frameborder="0" style="height: 185px; overflow:scroll; width: 100%" src="http://www.cbox.ws/box/?boxid=439&boxtag=7868&sec=main" marginheight="1" marginwidth="1" name="cboxmain" id="cboxmain" seamless="seamless" scrolling="no" frameborder="0" allowtransparency="true"></iframe>
This is how it appears (the shoutbox on homepage of http://www.talkjesus.com)
这是它的显示方式（http://www.talkjesus.com主页上的留言框）
How do I remove the horizontal scrollbar and modify the css of the vertical scrollbar?
如何去除水平滚动条并修改垂直滚动条的css？
采纳答案by takien
in your css:
在你的 css 中：
iframe{
overflow:hidden;
}
回答by THRIVE
Add scrolling="no"attribute to the iframe.
scrolling="no"向 iframe添加属性。
回答by Thyagarajan C
This works in all browsers. jsfiddle here http://jsfiddle.net/zvhysct7/1/
这适用于所有浏览器。jsfiddle在这里http://jsfiddle.net/zvhysct7/1/
<iframe src="http://buythecity.com" scrolling="no" style=" width: 550px; height: 500px; overflow: hidden;" ></iframe>
回答by nirvana74v
Adding scroll="no"and style="overflow:hidden"on iframe didn't work, I had to add style="overflow:hidden"on body of html document loaded inside iframe.
在 iframe 上添加scroll="no"和style="overflow:hidden"不起作用，我不得不style="overflow:hidden"在 iframe 内加载的 html 文档正文中添加。
回答by Allabux B
Try adding scrolling="no"attribute like below:
尝试添加scrolling="no"如下属性：
<iframe frameborder="0" scrolling="no" style="height:380px;width:6000px;border:none;" src='https://yoururl'></iframe>回答by Nima Rahbar
Just Add scrolling="no"and seamless="seamless"attributes to iframe tag. like this:-
只需添加scrolling="no"和seamless="seamless"属性iframe标签。像这样：-
1. XHTML => scrolling="no"
2. HTML5 => seamless="seamless"
回答by WraithKenny
If anyone here is having a problem with disabling scrollbars on the iframe, it could be because the iframe's content has scrollbars on elements belowthe htmlelement!
如果这里有人在禁用 上的滚动条时遇到问题iframe，那可能是因为 iframe 的内容在元素下方的html元素上有滚动条！
Some layouts set htmland bodyto 100% height, and use a #wrapperdiv with overflow: auto;(or scroll), thereby moving the scrolling to the #wrapperelement.
某些布局将html和设置body为 100% 高度，并使用#wrapper带有overflow: auto;(或scroll)的div ，从而将滚动移动到#wrapper元素。
In such a case, nothing you do will prevent the scrollbars from showing up except editing the other page's content.
在这种情况下，除了编辑其他页面的内容外，您所做的任何事情都不会阻止滚动条显示。
回答by Deepika Patel
Add this in your css to hide both scroll bar
将此添加到您的 css 中以隐藏两个滚动条
iframe
{
overflow-x:hidden;
overflow-Y:hidden;
}
回答by KnightFury
<div id="myInfoDiv" seamless="seamless" scrolling="no" style="width:100%; height: 100%; float: left; color: #FFF; background:#ed8719; line-height:100%; font-size:100%; font-family: sans-serif>;
Use the above div and it will not show scroll bar in any browser.
使用上面的 div，它不会在任何浏览器中显示滚动条。
回答by DotBot
This is a last resort, but worth mentioning -
you can use the ::-webkit-scrollbarpseudo-element on the iframe's parent to get rid of those famous 90's scroll bars.
这是最后的手段，但值得一提 - 您可以使用父::-webkit-scrollbar元素上的伪元素iframe来摆脱那些著名的 90 年代滚动条。
::-webkit-scrollbar {
width: 0px;
height: 0px;
}
Edit:though it's relatively supported, ::-webkit-scrollbarmay not suit all browsers. use with caution :)
编辑：虽然它相对受支持，但::-webkit-scrollbar可能不适合所有浏览器。谨慎使用:)
