Skip to main content
5 de 5
replaced http://pt.stackoverflow.com/ with https://pt.stackoverflow.com/

O iframe:

Você pode usar o "primo" do <frame>, o <iframe>, que além de suportado pelo HTML5, ganhou alguns novos atributos.

Com o iframe, HTML normal pode ser usado na página, ao mesmo tempo que os iframe colocado no body. iframes podem ser estilizados com CSS para se posicionar e ocupar o tamanho desejado, se comportando como qualquer elemento de bloco.

Assim você pode misturar conteúdo externo com a pagina até mesmo se o JavaScript estiver desligado. Inclusive, com o atributo sandbox, pode até bloquear o JS nas páginas carregadas dentro do iframe.

...
<body>
   <h1>Cabecalho da pagina<h1>
   <p>
      HTML normal pode ser usado na pagina, e o &lt;iframe&gt; colocado
      e estilizado com CSS para posicionar e ocupar o tamanho desejado,
      como qualquer elemento de bloco
   </p>
   <iframe name="coluna1" src="pagina.html" width="300" height="500">
   <iframe name="coluna2" src="pagina2.php" width="300" height="500">
   <p>
      Assim você pode misturar conteudo externo com a pagina ate mesmo se o
      JavaScript estiver desligado.
   </p>
</body>

Atributos do iframe em HTML5:

  • src = URL a ser carregado
  • srcdoc = Conteúdo HTML
  • name = contexto usado para target
  • sandbox = allow-same-origin, allow-top-navigation, allow-forms, allow-scripts
    define algumas restrições de segurança.
  • seamless = indica que o iframe deve ser renderizado aparentando ser parte da página
  • width = Largura em CSS Pixels
  • height = Altura em CSS Pixels
  • Além desses, o iframe suporta os atributos globais do HTML, como id, class etc.

Veja mais na documentação do W3C.

Largato
  • 92,9mil
  • 18
  • 190
  • 261