CSS Video Background Cover — видео на фон

Результат:

Пример:

<style>
video.demo-fullscreen {
	position: absolute;
	z-index: 0;
	object-fit: cover;
	width: 100%;
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);

	&::-webkit-media-controls {
		display:none !important;
	}
}

section.demo-container {
	position: relative;
	display: grid;
	place-items: center;
	height: 70vh;
	width: 70vw;
	margin: 0 auto;
	background: #ccc;
}

div.demo-content {
	z-index: 1;
}

div.demo-body {
	overflow: hidden;
	height: 400px;
	display: grid;
	place-items: center;
}
</style>
<div class="demo-body">
	<section class="demo-container">
		<video class="demo-fullscreen" src="https://disweb.ru/wp-content/uploads/2021/09/blurry-trees.mov" playsinline autoplay muted loop></video>
		<div class="demo-content">
			<h2>Headline</h2>
		</div>
	</section>
</div>

Пример на Codepen