Colocar um video como Background utilizando HTML + CSS

para o vídeo e atribua a ele uma classe ou ID.

Estilo CSS:
Aplique CSS ao contêiner para definir o vídeo como plano de fundo.
 
.video-container {
  position: relative;
  width: 100%; /* Set width of the container */  height: 400px; /* Set height of the container */  overflow: hidden;
}

.video-container video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -1;
}
 
Incorporando o vídeo:
 
Coloque o elemento 
 




Certifique-se de substituir “your-video-file.mp4” pelo caminho correto para o seu arquivo de vídeo.
 
Explicação do CSS:
 
.video-container é definido como um contêiner para o vídeo com dimensões específicas.
O elemento 
 
Lembre-se de que, embora a reprodução automática de vídeos possa chamar a atenção, é importante considerar a usabilidade e a acessibilidade ao implementar esses recursos. Além disso, alguns dispositivos móveis restringem a reprodução automática de vídeos para conservar dados e vida útil da bateria, por isso é uma boa prática fornecer conteúdo ou controles alternativos para o vídeo.
  
 
Tags: css,css para iniciantes,html