Bom dia pessoal. Estou com dificuldades para deixar meu vídeo responsivo, na verdade com uns exemplos que achei, ele fica na medida certa no mobile, mas eu não consigo definir o tamanho exato que preciso para a minha tela. Alguém pode me ajudar? Obrigada =D
Olá, amiga. Você tem uma dúvida bem simples de ser resolvida.
Seu vídeo talvez seja incorporado do Youtube, certo? Observe que quando vem do Youtube ele já vem com uma largura dentro da tag. Veja o seguinte código:
<iframe width="560" height="315" src="https://www.youtube.com/embed/GBaYBJdZCLM" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>Primeiro, apague esse width e height e seus respectivos valores.
segundo, vá no seu código css e defina o seguinte:
iframe{ max-width: 100%; } Terceiro, em cada tela você precisa definir uma largura específica. Para isso você precisa usar media queries no seu código css: (https://developer.mozilla.org/pt-BR/docs/Web/Guide/CSS/CSS_Media_queries ) e no seu media querie você precisa definir uma largura para cada tela.
Bom dia Paulo, obrigada pela ajuda! Mas então, as medias queries que tenho que fazer é para o iframe? tipo: iframe { widht: 500px; } ? porque eu tentei assim e não funcionou, o que funcionou foi eu deixar já inline: <iframe width="560" height="315" Mas mesmo assim, o valor que eu coloquei, ele não pega a imagem do video ao todo, ele fica com uma parte preta dos lados. https://imgur.com/a/FiYWeX9
Obrigada.
Olá, Marília. Realmente, lembrei-me agora que não está no local certo. Vamos fazer o seguinte, você me manda o seu código por e-mail e eu mando a resolução para você. Você pode tirar suas dúvidas comigo depois.
paulo.ricardo@boldcomunicacao.com.br whatsapp: 81 98354-8973