Quadros embutidos, comumente chamados de "iframes", são o único tipo de quadro permitido no HTML5. Esses quadros são essencialmente uma seção da sua página que você "corta". No espaço que você recortou da página, você pode inserir uma página da Web externa. Em essência, um iframe é outra janela do navegador dentro da sua página da web. Você codifica iframes comumente usados em sites que precisam incluir conteúdo externo, como um mapa do Google ou um vídeo do YouTube. Ambos os sites populares usam iframes em seu código de incorporação.
Como usar o elemento IFRAME
O elemento usa os elementos globais HTML5 e vários outros elementos. Quatro também são atributos no HTML 4.01:
- -O URL da origem do quadro
- -A altura da janela
- - a largura da janela
- O nome da janela
E três são novos em HTML5:
srcdocO HTML da origem do quadro. Este atributo tem precedência sobre qualquer URL nosrcatributocaixa de areia-Uma lista de recursos que devem ser permitidos ou não permitidos na janela do quadrodesatado- informa ao agente do usuário que o iframe deve ser renderizado como se fosse parte invisível do documento pai
Para criar um iframe simples, você define o URL de origem, a largura e a altura:
Observe que você pode optar por não usar valores de pixels para as configurações do seu iframe, mas pode optar por usar uma porcentagem. Se você estiver criando um site responsivo cujo dimensionamento deve mudar com diferentes tamanhos de tela, essas porcentagens serão importantes.
Existem também alguns atributos que são válidos em HTML 4.01, mas obsoletos em HTML5. Como a maioria dos sites hoje está usando o HTML5 +, esses atributos são os que você não deseja usar (mas que você pode ver em alguns documentos herdados).
- Em vez disso, use um
UMAelemento para vincular a uma descrição - Em vez disso, use o CSS
flutuadorpropriedade permitir transparênciaEm vez disso, use o CSSfundopropriedade para tornar o ifram transparente- - em vez disso, use o
fronteiraPropriedade CSS marginheightEm vez disso, use o CSSmargempropriedadelargura de margemEm vez disso, use o CSSmargempropriedade- Em vez disso, use o CSS
transbordarpropriedade
Suporte de Navegador IFRAME
o IFRAME elemento é suportado por todos os navegadores modernos:
- Android
- cromada
- Raposa de fogo
- Internet Explorer 2+
- iOS / Safari Mobile
- Netscape 7+
- Ópera 3+
- Safári
Se nenhum número de versão for mostrado na lista acima, isso ocorre porque todas as versões desse navegador o suportam.
Uma coisa a ter em mente é que, enquanto todos os navegadores suportam o IFRAME elemento, ainda há suporte limitado para alguns dos recursos do HTML5.
- Usando
transbordarpara desativar a rolagem não é confiável. Se você não quiser barras de rolagem em seus iframes, você deve continuar a usar orolagematributo. - o
srcdoc,caixa de areiaedesatadoos atributos não são suportados por nenhum navegador no momento.
Ligando com Iframes
Quando você dá seus iframes nome ou identidade você pode apontar seus links nesse quadro com o atributo no UMA elemento. Então, quando um usuário clicar no link, ele será aberto dentro do iframe referenciado em vez da janela atual.
Tente você mesmo. Digite o seguinte em uma página da web:
Este é meu iframe
Quando você clicar neste link, ele abrirá um novo documento dentro da janela acima.
id = "myIframe" src = "http://webdesign.about.com/#lp-main" height = "200px" width = "500px">
Se o documento foi aberto no IFRAME não tem metas definidas, todos esses links serão abertos no mesmo iframe que o documento pai.
Você pode usar esse recurso para criar links em um IFRAME mudar o conteúdo de outro IFRAME Na mesma página.
IFrames e Segurança
o IFRAME elemento, por si só, não é um risco de segurança para você ou seus leitores. Infelizmente, os iframes obtiveram uma má reputação porque podem ser usados por sites maliciosos para incluir conteúdo que pode infectar o computador de um visitante sem que ele seja visto na página. Isso é feito fazendo com que os links apontem para o invisível IFRAME e esses scripts iniciam código malicioso. O usuário clica no link e acha que o link está quebrado porque nada pareceu acontecer, mas um script foi definido onde não foi possível vê-lo.
Há também vírus de computador que injetarão um invisível IFRAME em suas páginas da Web, efetivamente transformando seu site em um botnet. Eles podem fazer isso através de injeção de SQL e outros ataques.
A coisa a lembrar ao incluir um IFRAME em sua página da web, os usuários são tão seguros quanto o conteúdo de todos os sites aos quais você vincula. Se você tem motivos para achar que um site é indigno de confiança, não o vincule de nenhuma maneira e, definitivamente, não inclua o conteúdo em um site. IFRAME. Vincular suas próprias páginas a iframes, no entanto, não representa um risco de segurança para você ou seus usuários.
Artigo original de Jennifer Krynin. Editado em 07/11/16 por Jeremy Girard
