Remove a borda do IFrame

Question

Como faço para remover a borda de um iframe incorporado em minha web app?Um exemplo de iframe é:

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

Eu gostaria de transição a partir do conteúdo da minha página para o conteúdo do iframe para ser perfeita, assumindo as cores de fundo são consistentes.O destino navegador IE6 só e, infelizmente, soluções para que os outros não irão ajudar.

Answer 1

Adicione o frameBorder atributo (nota: o capital 'B').

Então seria mais ou menos assim:

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

Answer 2

Depois de enlouquecer, tentando remover a borda no IE7, eu achei que o atributo frameBorder é sensível a maiúsculas e minúsculas.

Você tem que definir o atributo frameBorder com um capital B.

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

Answer 3

Como por iframe documentação, frameBorder é preterido e usando a "fronteira" do atributo do CSS é o preferido:

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

• Nota CSS fronteira propriedade não alcançar os resultados desejados no IE6, 7 ou 8.

Answer 4

Além de adicionar o atributo frameBorder você pode querer considerar a definição de rolagem atributo para "não" para impedir que as barras de rolagem aparecem.

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

Answer 5

Para o navegador questões específicas também adicionar frameborder="0" hspace="0" vspace="0" marginheight="0" marginwidth="0" de acordo com o 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>

Answer 6

Utilize o HTML iframe frameborder Atributo

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

Nota:utilizar a molduraBordem (cap B) para o IE, caso contrário não funcionará.Mas, o iframe frameborder atributo não é suportada no HTML5.Assim, Usar CSS em vez disso.

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

você também pode remover rolagem usando a rolagem atributo http://www.w3schools.com/tags/att_iframe_scrolling.asp

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

Você também pode usar perfeita atributo que é novo em HTML5.A perfeita atributo da tag iframe é suportada apenas no Opera, Chrome e Safari.Quando presente, especifica que o iframe deve parecer que é uma parte do documento que contém (sem bordas ou barras de rolagem).A partir de agora, A emenda do atributo da tag só é suportado no Opera, Chrome e Safari.Mas em um futuro próximo será a solução padrão e será compatível com todos os navegadores. http://www.w3schools.com/tags/att_iframe_seamless.asp

Answer 7

Você pode usar style="border:0;" em seu código iframe.Essa é a forma recomendada para remover borda em HTML5.

Confira meu html5 iframe gerador ferramenta para personalizar a sua iframe sem a edição de código.

Answer 8

Adicionar o atributo frameBorder (Capital 'B').

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

Answer 9

Propriedade de estilo pode ser usado Para HTML5 se você deseja remover o boder de seu quadro ou qualquer coisa que você pode usar a propriedade de estilo.como dado abaixo

O código vai aqui

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

Answer 10

Você também pode fazer isso com JavaScript desta forma.Ele vai encontrar quaisquer elementos iframe e remover suas fronteiras no IE e outros navegadores (que você pode apenas definir um estilo de "fronteira :none;" nos navegadores IE, em vez de usar JavaScript).E ele vai funcionar, mesmo se utilizado APÓS o iframe é gerado e no local do documento (por exemplo,iframes que são adicionados no HTML simples e não JavaScript)!

Este parece funcionar porque o IE cria a fronteira, e não o elemento iframe, como seria de esperar, mas no CONTEÚDO do iframe--após o iframe é criado de BOM.($@&*#@!!!IE!!!)

Nota:O IE parte só vai funcionar (é claro) se a janela principal e iframe são da MESMA origem (mesmo domínio, porta, protocolo, etc.).Caso contrário, o script irá obter "acesso negado" erros no IE erro console.Se isso acontecer, sua única opção é definir antes de ser gerado, como outros já apontaram, ou de uso não-padrão frameBorder="0" atributo.(ou apenas deixar o IE olhar fugly--minha opção favorita ;) )

Levou-me MUITAS horas de trabalho ao ponto de desespero para descobrir isso...

Desfrute.:)

// =========================================================================
// Remove borders on iFrames

if (window.document.getElementsByTagName("iframe"))
   {
      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.
         }
   }

Answer 11

Se o doctype da página que você está colocando o iframe é HTML5, em seguida, você pode usar o seamless atributo da seguinte maneira:

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

Mozilla docs em perfeita atributo

Answer 12

Eu tentei todas as opções acima e se isso não funcionar para você, tente o abaixo CSS resolvido o problema para mim.Que apenas diz que os navegadores para não adicionar qualquer preenchimento ou margem.

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

Answer 13

Na sua folha de estilos adicionar

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

}

Esta também é uma opção viável.

Answer 14

Se você estiver usando o iFrame para ajustar a largura e altura da tela inteira, o que eu estou supondo que você não esteja com base no tamanho de 300x300, você deve também definir o corpo margens para "0" como este:

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

Answer 15

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

Este código deve funcionar em HTML 4 e 5.

Answer 16

também set border="0"

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

Answer 17

Tente

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

Isto irá remover a borda da moldura.

Answer 18

Use este

style="border:none;

Exemplo:

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

Answer 19

Adicionar o atributo frameBorder, ou use estilo com largura de borda 0px; ou definir o estilo da borda igual a nenhum.

use qualquer um dos abaixo de 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>

Answer 20

Para remover a borda que você pode usar CSS fronteira propriedade de nenhum.

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

Answer 21

A sua simples, basta adicionar o atributo na tag iframe frameborder = 0 <iframe src="" width="200" height="200" frameborder="0"></iframe>

Answer 22

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

Funciona com o Firefox ;)

Answer 23

<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 browser 
does not support iframes.</iframe>

The <iframe> frameborder attribute is not supported in HTML5. Use CSS 
instead.