SITEDISCORD

🌐Tag <iframe> para incluir conteúdo externo

A tag <iframe> incorpora conteúdo externo em páginas HTML. Use src para a URL, width e height para dimensões, frameborder para borda, e allowfullscreen para tela cheia. Exemplo: vídeo do YouTube.

Introdução

A tag <iframe> é usada em HTML para incorporar outra página HTML ou conteúdo externo dentro da página atual. Isso permite, por exemplo, incorporar vídeos do YouTube diretamente em seu site, mapas, e outros conteúdos hospedados externamente.

Atributos Comuns da Tag <iframe>

  1. src:

    • Especifica a URL da página ou conteúdo a ser incorporado.

    • Exemplo:

      <iframe src="https://www.exemplo.com"></iframe>

  2. width e height:

    • Definem a largura e altura do iframe.

    • Exemplo:

      <iframe src="https://www.exemplo.com" width="600" height="400"></iframe>

  3. frameborder:

    • Define se o iframe terá uma borda (assim como o border ta tag table). O valor "0" remove a borda.

    • Exemplo:

      <iframe src="https://www.exemplo.com" frameborder="0"></iframe>

  4. allowfullscreen:

    • Permite que o conteúdo do iframe seja exibido em tela cheia.

    • Exemplo:

      <iframe src="https://www.exemplo.com" allowfullscreen></iframe>

Exemplo de Incorporação de Vídeo do YouTube

Para incorporar um vídeo do YouTube em uma página HTML, use a URL do vídeo no atributo src da tag <iframe>.

Passos:

  1. Encontre o vídeo no YouTube que deseja incorporar.

  2. Clique em "Compartilhar" abaixo do vídeo e selecione "Incorporar".

  3. Copie o código fornecido ou a URL de incorporação.

Exemplo:

<html>
<head>
    <title>Vídeo do YouTube Incorporado</title>
</head>
<body>
    <h1>Incorporando um Vídeo do YouTube</h1>
    <iframe width="560" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</body>
</html>
AnteriorTag <video> para adicionar vídeosPróximoCliente (client) e Servidor (server)

Atualizado

Isto foi útil?