Iframes HTML
Um iframe HTML é usado para exibir uma página da Web dentro de uma página da Web.
Sintaxe HTML Iframe
A tag HTML <iframe>especifica um quadro embutido.
Um quadro embutido é usado para incorporar outro documento no documento HTML atual.
Sintaxe
<iframe src="url" title="description"></iframe>
Dica: é uma boa prática sempre incluir um
titleatributo para o arquivo <iframe>. Isso é usado por leitores de tela para ler qual é o conteúdo do iframe.
Iframe - Definir Altura e Largura
Use os atributos heighte para especificar o tamanho do iframe.width
A altura e a largura são especificadas em pixels por padrão:
Exemplo
<iframe src="demo_iframe.htm" height="200" width="300"
title="Iframe Example"></iframe>
Ou você pode adicionar o styleatributo e usar o CSS heighte as width
propriedades:
Exemplo
<iframe src="demo_iframe.htm" style="height:200px;width:300px;"
title="Iframe Example"></iframe>
Iframe - Remova a borda
Por padrão, um iframe tem uma borda ao seu redor.
Para remover a borda, adicione o styleatributo e use a
borderpropriedade CSS:
Exemplo
<iframe src="demo_iframe.htm" style="border:none;"
title="Iframe Example"></iframe>
Com CSS, você também pode alterar o tamanho, estilo e cor da borda do iframe:
Exemplo
<iframe src="demo_iframe.htm" style="border:2px solid red;"
title="Iframe Example"></iframe>
Iframe - Destino para um link
Um iframe pode ser usado como o quadro de destino para um link.
O targetatributo do link deve se referir ao nameatributo do iframe:
Exemplo
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe
Example"></iframe>
<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>
Resumo do capítulo
- A tag HTML
<iframe>especifica um frame embutido - O
srcatributo define a URL da página a ser incorporada - Sempre inclua um
titleatributo (para leitores de tela) - Os atributos
heightand especificam o tamanho do iframewidth - Use
border:none;para remover a borda ao redor do iframe
Exercícios HTML
Tag de iframe HTML
| Tag | Description |
|---|---|
| <iframe> | Defines an inline frame |
Para obter uma lista completa de todas as tags HTML disponíveis, visite nossa Referência de tags HTML .