Remover borda do IFrame

Como remover a borda de um iframe incorporado no meu aplicativo da web? Um exemplo do iframe é:

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

Eu gostaria que a transição do conteúdo da minha página para o conteúdo do iframe fosse perfeita, assumindo que as cores do plano de fundo sejam consistentes. O navegador de destino é apenas o IE6 e, infelizmente, soluções para outros não ajudarão.

Adicione o frameBorderatributo (observe o capital 'B' ).

Então seria assim:

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

Depois de enlouquecer tentando remover a borda no IE7, descobri que o atributo frameBorder faz distinção entre maiúsculas e minúsculas.

Você precisa definir o atributo frameBorder com B maiúsculo .

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

De acordo com a documentação do iframe , o frameBorder está obsoleto e o uso do atributo CSS "border" é o preferido:

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

• Nota A propriedade de borda CSS não alcança os resultados desejados no IE6, 7 ou 8.

Além de adicionar o atributo frameBorder, convém definir o atributo de rolagem como "não" para impedir a exibição de barras de rolagem.

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

Para problemas específicos do navegador, adicione também de frameborder="0" hspace="0" vspace="0" marginheight="0" marginwidth="0"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>

Use o atributo iframe frameborder HTML

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

Nota: use a ordem do quadro B (tampa B) para o IE, caso contrário não funcionará. Mas, o atributo iframe frameborder não é suportado no HTML5. Portanto, use CSS.

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

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

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

Além disso, você pode usar o atributo contínuo que é novo no HTML5. O atributo contínuo da tag iframe é suportado apenas no Opera, Chrome e Safari. Quando presente, especifica que o iframe deve parecer que faz parte do documento que contém (sem bordas ou barras de rolagem). A partir de agora, o atributo contínuo da tag é suportado apenas 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

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

Confira minha ferramenta de gerador de iframe html5 para personalizar seu iframe sem editar o código.

A propriedade Style pode ser usada No HTML5, se você desejar remover o codificador do seu quadro ou qualquer outra coisa, use a propriedade style. como indicado abaixo

Código vai aqui

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

Adicione o atributo frameBorder (Capital 'B').

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

Você também pode fazer isso com JavaScript dessa maneira. Ele encontrará qualquer elemento iframe e remove suas bordas no IE e em outros navegadores (embora você possa definir um estilo de "border: none;" em navegadores que não sejam do IE, em vez de usar JavaScript). E funcionará mesmo se usado APÓS o iframe ser gerado e no local no documento (por exemplo, iframes adicionados em HTML simples e não em JavaScript)!

Isso parece funcionar porque o IE cria a borda, não no elemento iframe como seria de esperar, mas no CONTEÚDO do iframe - depois que o iframe é criado na BOM. ($ @ & * # @ !!! IE !!!)

Nota: A parte do IE só funcionará (é claro) se a janela pai e o iframe forem da mesma origem (mesmo domínio, porta, protocolo etc.). Caso contrário, o script receberá erros de "acesso negado" no console de erros do IE. Se isso acontecer, sua única opção é configurá-lo antes de ser gerado, como outros observaram, ou usar o atributo frameBorder = "0" não padrão. (ou apenas deixe o IE parecer indecente - minha opção favorita atual;))

Levei MUITAS horas de trabalho a ponto de desesperar para descobrir isso ...

Aproveitar. :)

// =========================================================================
// 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.
         }
   }

Eu tentei todas as opções acima e, se isso não funcionar, tente o CSS abaixo: resolvi o problema para mim. O que apenas diz aos navegadores para não adicionar nenhum preenchimento ou margem.

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

Se o doctype da página em que você está colocando o iframe for HTML5, você poderá usar o seamlessatributo da seguinte maneira:

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

Documentos da Mozilla sobre o atributo contínuo

Na sua folha de estilo, adicione

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

}

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

Se você estiver usando o iFrame para ajustar a largura e a altura da tela inteira, suponho que você não seja baseado no tamanho de 300 x 300, também deverá definir as margens do corpo como "0" desta forma:

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

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

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

Adicione o atributo frameBorder ou use o estilo com largura da borda 0px; ou defina o estilo da borda igual a nenhum.

use qualquer um 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>

defina também border = "0px"

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

Tentar

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

Isso removerá a borda do seu quadro.

Usa isto

style="border:none;

Exemplo:

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

Para remover a borda, você pode usar a propriedade CSS border para none.

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

É simples adicionar atributo na tag iframe frameborder = 0 <iframe src="" width="200" height="200" frameborder="0"></iframe>

1.Via Inline Style set border: 0

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

2. Através do atributo Tag Atributo frameBorder 0

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

3. Se tivermos vários quadros I, podemos dar classe e colocar css interno ou externamente.

HTML:

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

Eu tive um problema com a borda branca inferior e não consegui corrigi-lo com as regras de borda, margem e preenchimento ... Portanto, adicione display:block;porque o iframe é um elemento embutido.

Isso leva em consideração o espaço em branco no seu HTML.

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

Funciona com o Firefox;)

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