Repositório Códigos HTML

21. Vídeos

21.1. Vídeo Youtube largura total

Para incorporar vídeos do youtube, você precisa copiar o código de incorporação disponível abaixo do vídeo, ao clicar em Compartilhar. O código de incorporação começa <iframe... com </iframe>.

Veja a seguir o código de incorporação comentado.

Código
<div class="responsive-video"><iframe width="560" height="315" src="https://www.youtube.com/embed/A-i1Dx9DnKM" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div>
Comentário

O trecho em verde garante com que o vídeo ocupe a totalidade da coluna e redimensione sem perder a proporção. A parte verde não deve ser alterada.

O trecho em amarelo deve ser substituído pelo código de incorporação copiado do Youtube.

O trecho em rosa é o ID do vídeo. Com tempo você perceberá que esta é a única informação que muda de um vídeo para o outro no código do Youtube.

O resultado do código acima é este: