Oii gentee.! Hoje eu vô ensinar vocês a colocar BGs em videos, tipo os dos videos do dia aqui no blog. Eu acho bem fofo fazer isso em videos porque fica diferente dos outros. É bem simples. Vamô-lá:
Uma das melhores coisas desse tutorial, é que não é preciso mexer no HTML do layout.!
Algums backgrounds:
Edite o codigo a seguir:
<center><div style="background: url( URL DA IMAGEM/ BACKGROUND) left no-repeat; height: 512px; width: 600px;">
<div style="float: left; padding-left: 32px; padding-top: 120px;">
<iframe allowfullscreen="" frameborder="0" height="320" src=" código do vídeo" width="460"></iframe></div>
</div></center>
URL DA IMAGEM/ BACKGROUND: Coloque o endereço da imagem que ficará como background no vídeo.
height: 512: Coloque a largura da imagem ( altere apenas o valor )
width: 600: Coloque a largura da imagem ( altere apenas o valor )
height="320: Coloque a largura do vídeo acima da imagem
width="460: Coloque a altura do vídeo
código do vídeo: Coloque o endereço do vídeo que tem no código de incorporação.
Como pegar o código do vídeo:
Pronto é só isso.!! Mas pra quem ainda não sabe mexer muito nesses códigos, eu vou deixar um pronto aqui:
<center><div style="background: url( http://2.bp.blogspot.com/-TFAK2baMnQw/Tl0IRzhL2PI/AAAAAAAADOo/vHM9_ZHzdV0/s1600/v%25C3%2583%25C2%25ADdeo+trechy2.png) left no-repeat; height: 348px; width: 480px;">
<div style="float: left; padding-left: 22px; padding-top: 38px;">
<iframe allowfullscreen="" frameborder="0" height="253" src=" código do vídeo" width="438"></iframe></div>
</div>
</center>
<div style="float: left; padding-left: 22px; padding-top: 38px;">
<iframe allowfullscreen="" frameborder="0" height="253" src=" código do vídeo" width="438"></iframe></div>
</div>
</center>
Resultado:
Nenhum comentário:
Postar um comentário