Разместите видео на фоне вашего сайта - создайте неповторимую атмосферу

Фоновое видео (background video) представляет собой видео, которое используется в качестве заднего фона веб-страницы или другого веб-элемента. При использовании фонового видео можно создать эффект движения и живости на веб-странице, что помогает привлечь внимание пользователей и сделать сайт более привлекательным.

Вот пример кода, демонстрирующего применение фонового видео на веб-странице с использованием HTML и CSS:

HTML:

html

  
  

    
  

CSS:

css
.background-video {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
.background-video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.background-video .content {
  position: relative;
  z-index: 1;
  /* Дополнительные стили для контента */
}

В этом примере мы создаем контейнер `.background-video`, который заполняет всю доступную высоту и ширину экрана (`100vh` и `100%`). Затем мы добавляем видео с использованием HTML5 тега `, применяем необходимые атрибуты (`autoplay` для автозапуска, `loop` для бесконечного повторения, `muted` для беззвучного проигрывания) и указываем путь к видеофайлам (`background.mp4` и `background.webm`). Если браузер не поддерживает видео в формате MP4 или WebM, будет отображено сообщение "Your browser does not support the video tag.".

Контент, который мы хотим отобразить над видео, помещаем внутрь `