Bem, estou fazendo meu site e a primeira coisa a fazer foi meter o video como fundo, até ai tudo bem, mas quando tento adicionar menus, o video é "puxado" para baixo para aparecer o tal menu, mas eu quero que o menu apareça por cima do video
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
body, html{
width: 100%;
height: 100%;
font-family: sans-serif;
font-size:22px;
line-height: 1.3;
}
.bg_video{
position: fixed;
min-width: 100%;
min-height: 100%;
width: auto;
height: 0;
right: auto;
left: auto:
bottom: 0;
background-color: black;
transition: 1s opacity;
}
.body{
padding:20px;
background: rgba(255,255,255,0.9);
margin: 30% auto 20px auto;
max-width: 960px;
border-radius: 10px;
}
#b{ text-color:white; }
</style>
</head>
<body>
<h6 id="b">Lusitanis</h6> /*Se remover esta linha do h6, o site fica normal, se não remover, o video é puxado para baixo, mostrando este header e com fundo branco*/
<div>
<video autoplay loop poster="polina.jpg" class="bg_video">
<source src="bg.webm" type="video/webm">
<source src="bg.mp4" type="video/mp4">
</video>
</div>
</body>
</html>
Como faço para resolver isso? Tive a tarde toda de hoje a tentar resolver esse problema
Pergunta
Ragnar
Bem, estou fazendo meu site e a primeira coisa a fazer foi meter o video como fundo, até ai tudo bem, mas quando tento adicionar menus, o video é "puxado" para baixo para aparecer o tal menu, mas eu quero que o menu apareça por cima do video
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>Title</title> <style> *{ margin: 0; padding: 0; box-sizing: border-box; } body, html{ width: 100%; height: 100%; font-family: sans-serif; font-size:22px; line-height: 1.3; } .bg_video{ position: fixed; min-width: 100%; min-height: 100%; width: auto; height: 0; right: auto; left: auto: bottom: 0; background-color: black; transition: 1s opacity; } .body{ padding:20px; background: rgba(255,255,255,0.9); margin: 30% auto 20px auto; max-width: 960px; border-radius: 10px; } #b{ text-color:white; } </style> </head> <body> <h6 id="b">Lusitanis</h6> /*Se remover esta linha do h6, o site fica normal, se não remover, o video é puxado para baixo, mostrando este header e com fundo branco*/ <div> <video autoplay loop poster="polina.jpg" class="bg_video"> <source src="bg.webm" type="video/webm"> <source src="bg.mp4" type="video/mp4"> </video> </div> </body> </html>Como faço para resolver isso? Tive a tarde toda de hoje a tentar resolver esse problema
Link para o comentário
Compartilhar em outros sites
0 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.