Tags de incorporação

Abaixo mostro os mesmos arquivos sendo exibidos com as tags <embed>, <iframe> e <object>, nessa ordem.

Código:

<embed width:400px; height:400px; src="arquivo.ext"/>
<iframe style="width:400px; height:400px;" src="arquivo.ext"></iframe>
<object width:400px; height:400px; data="arquivo.ext"></object>

Informações:

Por padrão, a tag <iframe> exibe uma borda em volta da "página". Para remover isso, basta usar style="border:0;".

No Google Chrome, todas as tags exibiram os arquivos do mesmo modo, exceto a borda em <iframe>.

No Mozilla Firefox, a tag <embed> teve dificuldade para exibir vários tipos de arquivos.

Não fiz testes no Internet Explorer porque não tenho Windows em casa.

Formatos de arquivos (extensões) testados:

Imagem .png

Vídeo .ogv

Animação .swf

Página .html

Documento .pdf

Documento .txt

Documento .css

Documento .js

1. Imagem .png

Na tag <iframe> a imagem é exibida em tamanho real, as outras duas a esticam, de acordo com o tamanho definido para o elemento.

Atenção! Este é apenas um teste de incorporação a forma correta de exibir imagens é <img src="imagem.png"/>.

2. Vídeo .ogv

Atenção! Este é apenas um teste de incorporação, a tag correta para exibição de vídeos é <video>. Saiba mais no tutorial Mostrar vídeo com HTML 5.

3. Animação .swf

4. Página .html

A tag recomendada para essa finalidade é <iframe>.

5. Documento .pdf

6. Documento .txt

7. Documento .css

Este é o formato da folha de estilos em cascata.

8. Documento .js

Este é o formato de um código JavaScript.

volte para o topo ↑