从IFrame中删除边框

小开

最佳答案

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

所以它看起来像：

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

小开

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

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

小开

在疯狂地试图删除IE7中的边框后，我发现frame边境属性区分大小写。

您必须使用大写字母B设置frame边境属性。

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

小开

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

<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>

小开

根据ifram留档，不建议使用frame边境，并且首选使用“边界”CSS属性：

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

注意CSS边界属性没有在IE6、7或8中确实达到了预期的结果。

小开

你也可以用JavaScript这样做。它会在IE和其他浏览器中找到任何ifram元素并删除它们的边框（尽管你可以在非IE浏览器中设置一个样式的“边界：无；”而不是使用JavaScript）。即使在生成ifram并在文档中就位后使用它，它也会工作（例如，用纯超文本标记语言而不是JavaScript添加的ifram）！

这似乎是有效的，因为IE创建边框，而不是像您期望的那样在iframe元素上，而是在iframe的CONTENT上-在BOM中创建iframe之后。（$@&*#@！！！ IE！！）

注意：IE部分仅在父窗口和ifram来自相同来源（相同的域、端口、协议等）的情况下（当然）才能工作。否则脚本将在IE错误控制台中收到“拒绝访问”错误。如果发生这种情况，你唯一的选择就是在生成之前设置它，正如其他人所指出的，或者使用非标准的frameFron=“0”属性。（或者让IE看起来很模糊——我目前最喜欢的选项；））

我花了很多时间工作到绝望的地步才弄清楚…

享受：）

// =========================================================================// Remove borders on iFrames
var iFrameElements = window.document.getElementsByTagName("iframe");for (var i = 0; i < iFrameElements.length; i++){iFrameElements[i].frameBorder="0";   //  For other browsers.iFrameElements[i].setAttribute("frameBorder", "0");   //  For other browsers (just a backup for the above).iFrameElements[i].contentWindow.document.body.style.border="none";   //  For IE.}

小开

如果您放置ifram的页面的doctype是HTML5，那么您可以像这样使用seamless属性：

<iframe src="..." seamless="seamless"></iframe>

Mozilla文档的无缝属性

小开

iframe src="XXXXXXXXXXXXXXX"marginwidth="0" marginheight="0" width="xxx" height="xxx"

适用于Firefox；）

小开

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

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

小开

使用超文本标记语言iFrame框架属性

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

注意：IE使用框架Border（帽B），否则将无法正常工作。但是，HTML5不支持iframebord属性。所以，改用CSS。

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

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

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

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

小开

在样式表中添加

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

这也是一个可行的选择。

小开

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

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

小开

添加frame边境属性（大写'B'）。

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

小开

如果您使用iFrame来适应整个屏幕的宽度和高度，我假设您不是基于300x300大小，您还必须将主体边距设置为“0”，如下所示：

<body style="margin:0px;">

小开

<iframe src="mywebsite" frameborder="0" style="border: 0px solid white;">HTML iFrame is not compatible with your browser</iframe>

此代码应适用于超文本标记语言4和5。

小开

还设置边框="0px"

 <iframe src="yoururl" width="100%" height="100%" frameBorder="0"></iframe>

小开

样式属性可以使用对于HTML5，如果您想删除框架的boder或任何内容，您可以使用style属性。如下所示

代码在这里

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

小开

试试看

<iframe src="url" style="border:none;"></iframe>

这将删除框架的边框。

小开

要删除边框，您可以使用CSS边框属性为无。

<iframe src="myURL" width="300" height="300" style="border: none">Browser not compatible.</iframe>

小开

用这个

style="border:none;

示例：

<iframe src="your.html" style="border:none;"></iframe>

小开

添加frameFronder属性，或者将style与border-区宽0px；一起使用，或者将边框样式设置为无。

使用以下3中的任何一个：

<iframe src="myURL" width="300" height="300" style="border-width:0px;">Browser not compatible.</iframe>
<iframe src="myURL" width="300" height="300" frameborder="0">Browser not compatible.</iframe>
<iframe src="myURL" width="300" height="300" style="border:none;">Browser not compatible.</iframe>

小开

它的简单只是在ifram标签framebord=0中添加属性<iframe src="" width="200" height="200" frameborder="0"></iframe>

小开

<iframe src="URL" frameborder="0" width="100%" height="200"><p>Your browser does not support iframes.</p></iframe>
<iframe frameborder="1|0">
(OR)
<iframe src="URL" width="100%" height="300" style="border: none">Your browserdoes not support iframes.</iframe>
The <iframe> frameborder attribute is not supported in HTML5. Use CSSinstead.

小开

1.通过内联样式设置边框：0

 <iframe src="display_file.html" style="height: 400px; width:100%;border: 0;">HTML iFrame is not compatible with your browser</iframe>

2.通过标签属性帧边框设置0

<iframe src="display_file.html" width="300" height="300" frameborder="0">Browser not compatible.</iframe>

3.如果我们有多个I Frame，我们可以给类并将css放在内部或外部。

超文本标记语言：

<iframe src="display_file.html" class="no_border_iframe">HTML iFrame is not compatible with your browser</iframe>

css：

<style>.no_border_iframe{border: 0; /* or border:none; */}</style>

小开

我有一个底部白色边框的问题，我无法用边框，边距和填充规则修复它……所以添加display:block;，因为ifram是一个内联元素。

这需要考虑超文本标记语言中的空格。

小开

对我来说，添加效果很好

.iframe{box-shadow: none !important;}

这个解决方案特别适用于我正在编辑的shop ify主题。shop ify主题在整个主题中以不同的方式使用ifram，其中一个出现了故障。我不得不手动进入css并覆盖css属性。