Html 从 IFrame 中删除边框

Remove border from IFrame

提问by JoelB

How would I remove the border from an iframe embedded in my web app? An example of the iframe is:

如何从嵌入在我的网络应用程序中的 iframe 中删除边框？iframe 的一个例子是：

<iframe src="myURL" width="300" height="300">Browser not compatible.</iframe>

I would like the transition from the content on my page to the contents of the iframe to be seamless, assuming the background colors are consistent. The target browser is IE6 only and unfortunately solutions for others will not help.

我希望从我的页面内容到 iframe 内容的过渡是无缝的，假设背景颜色是一致的。目标浏览器仅为 IE6，不幸的是其他人的解决方案无济于事。

回答by David Basarab

Add the frameBorderattribute (note the capital ‘B').

添加frameBorder属性（注意大写 'B'）。

So it would look like:

所以它看起来像：

<iframe src="myURL" width="300" height="300" frameBorder="0">Browser not compatible.</iframe>

回答by Adam

After going mad trying to remove the border in IE7, I found that the frameBorder attribute is case sensitive.

在 IE7 中疯狂尝试删除边框后，我发现 frameBorder 属性区分大小写。

You have to set the frameBorder attribute with a capital B.

您必须使用大写B设置 frameBorder 属性。

<iframe frameBorder="0"></iframe>

回答by Roberto Chiaretti

As per iframedocumentation, frameBorder is deprecated and using the "border" CSS attribute is preferred:

根据iframe文档，不推荐使用 frameBorder 并首选使用“border”CSS 属性：

<iframe src="test.html" style="width: 100%; height: 400px; border: 0"></iframe>

• Note CSS border property does notachieve the desired results in IE6, 7 or 8.

• 注意 CSS 边框属性在 IE6、7 或 8中没有达到预期的效果。

回答by xenox

In addition to adding the frameBorder attribute you might want to consider setting the scrolling attribute to "no" to prevent scrollbars from appearing.

除了添加 frameBorder 属性外，您可能还需要考虑将滚动属性设置为“no”以防止出现滚动条。

<iframe src="myURL" width="300" height="300" frameBorder="0" scrolling="no">Browser not compatible. </iframe > 

回答by Marnix Bras

For browser specific issues also add frameborder="0" hspace="0" vspace="0" marginheight="0" marginwidth="0"according to Dreamweaver:

对于浏览器的特定问题，也frameborder="0" hspace="0" vspace="0" marginheight="0" marginwidth="0"根据 Dreamweaver添加：

<iframe src="test.html" name="banner" width="300" marginwidth="0" height="300" marginheight="0" align="top" scrolling="No" frameborder="0" hspace="0" vspace="0">Browser not compatible. </iframe>

回答by Shubham Badal

Use the HTML iframe frameborder Attribute

使用 HTML iframe frameborder 属性

http://www.w3schools.com/tags/att_iframe_frameborder.asp

http://www.w3schools.com/tags/att_iframe_frameborder.asp

Note: use frameBorder (cap B) for IE, otherwise will not work. But, the iframe frameborder attribute is not supported in HTML5. So, Use CSS instead.

注意：IE使用 frame B顺序（cap B），否则将不起作用。但是，HTML5 不支持 iframe frameborder 属性。因此，请改用 CSS。

<iframe src="http://example.org" width="200" height="200" style="border:0">

you can also remove scrolling using scrolling attribute http://www.w3schools.com/tags/att_iframe_scrolling.asp

您还可以使用滚动属性http://www.w3schools.com/tags/att_iframe_scrolling.asp删除滚动

<iframe src="http://example.org" width="200" height="200" scrolling="no" style="border:0">

Also you can use seamless attribute which is new in HTML5. The seamless attribute of the iframe tag is only supported in Opera, Chrome and Safari. When present, it specifies that the iframe should look like it is a part of the containing document (no borders or scrollbars). As of now, The seamless attribute of the tag is only supported in Opera, Chrome and Safari. But in near future it will be the standard solution and will be compatible with all browsers. http://www.w3schools.com/tags/att_iframe_seamless.asp

您也可以使用 HTML5 中新增的无缝属性。iframe 标签的无缝属性仅在 Opera、Chrome 和 Safari 中支持。当存在时，它指定 iframe 应该看起来像是包含文档的一部分（没有边框或滚动条）。截至目前，标签的无缝属性仅支持 Opera、Chrome 和 Safari。但在不久的将来，它将成为标准解决方案，并将与所有浏览器兼容。http://www.w3schools.com/tags/att_iframe_seamless.asp

回答by Shan Eapen Koshy

You can use style="border:0;"in your iframe code. That is the recommended way to remove border in HTML5.

您可以style="border:0;"在 iframe 代码中使用。这是在 HTML5 中删除边框的推荐方法。

Check out my html5 iframe generatortool to customize your iframe without editing code.

查看我的html5 iframe 生成器工具，无需编辑代码即可自定义 iframe。

回答by Arpan Saini

Style property can be usedFor HTML5 if you want to remove the boder of your frame or anything you can use the style property. as given below

如果您想删除框架的边框或任何可以使用 style 属性的内容，则可以为HTML5 使用 Style 属性。如下所示

Code goes here

代码在这里

<iframe src="demo.htm" style="border:none;"></iframe>

回答by Harden Rahul

Add the frameBorder attribute (Capital ‘B').

添加 frameBorder 属性（大写“B”）。

<iframe src="myURL" width="300" height="300" frameBorder="0">Browser not compatible. </iframe>

回答by th0ward

I tried all of the above and if that doesn't work for you try the below CSS resolved the issue for me. Which just tells the browsers to not add any padding or margin.

我尝试了以上所有方法，如果这对您不起作用，请尝试以下 CSS 为我解决了问题。这只是告诉浏览器不要添加任何填充或边距。

* {
  padding:0px;
  margin:0px;
 }