YouTube ( & video tag ) 背景動画として全画面に表示

IEやEdge(Legacy)などの古いブラウザの対応は考慮していません。
IEやEdge(Legacy)などの古いブラウザの対応を考慮せず、
縦横のスクロールバーが表示されると隠れてしまうなど、
細かな事を気にせずであればシンプルに記述できますね。

追記
こちらの投稿によると、
YouTube埋め込みプレーヤーの前に視覚的要素を配置できないようです。つまり、
YouTube埋め込みプレーヤーを背景に使用することはできないようで、
YouTube埋め込みプレーヤーを背景に使用することはガイドライン違反になりそうです。。。

demo（ガイドライン違反の可能性があるのでリンクは解除）
code

<video  class="video-background-fixed-contain"   src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4" playsinline autoplay loop muted></video>
<video  class="video-background-fixed-cover"     src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4" playsinline autoplay loop muted></video>
<video  class="video-background-contain"         src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4" playsinline autoplay loop muted></video>
<video  class="video-background-cover"           src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerJoyrides.mp4" playsinline autoplay loop muted></video>
<iframe class="youtube-background-fixed-contain" src="https://www.youtube.com/embed/ZhJe6-XCjdI?playlist=ZhJe6-XCjdI&playsinline=1&autoplay=1&controls=0&disablekb=1&iv_load_policy=3&modestbranding=1&fs=0&loop=1&mute=1"></iframe>
<iframe class="youtube-background-fixed-cover"   src="https://www.youtube.com/embed/ZhJe6-XCjdI?playlist=ZhJe6-XCjdI&playsinline=1&autoplay=1&controls=0&disablekb=1&iv_load_policy=3&modestbranding=1&fs=0&loop=1&mute=1"></iframe>
<iframe class="youtube-background-contain"       src="https://www.youtube.com/embed/ZhJe6-XCjdI?playlist=ZhJe6-XCjdI&playsinline=1&autoplay=1&controls=0&disablekb=1&iv_load_policy=3&modestbranding=1&fs=0&loop=1&mute=1"></iframe>
<div      class="youtube-background-cover-container">
  <iframe class="youtube-background-cover"       src="https://www.youtube.com/embed/ZhJe6-XCjdI?playlist=ZhJe6-XCjdI&playsinline=1&autoplay=1&controls=0&disablekb=1&iv_load_policy=3&modestbranding=1&fs=0&loop=1&mute=1"></iframe>
</div>

.video-background-fixed-contain {
  object-fit: contain;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
.video-background-fixed-cover {
  object-fit: cover;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
.video-background-contain {
  object-fit: contain;
  object-position: center top;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}
.video-background-cover {
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
}

.youtube-background-fixed-contain {
  position: fixed;
  top:  50%;
  left: 50%;
  width:  min(100vw, calc(100vh / (9 / 16)));
  height: min(100vh, calc(100vw * (9 / 16)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-fixed-cover {
  position: fixed;
  top:  50%;
  left: 50%;
  width:  max(100vw, calc(100vh / (9 / 16)));
  height: max(100vh, calc(100vw * (9 / 16)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-contain {
  position: absolute;
  top:   0%;
  left: 50%;
  width:  min(100vw, calc(100vh / (9 / 16)));
  height: min(100vh, calc(100vw * (9 / 16)));
  transform: translate(-50%,   0%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-cover-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.youtube-background-cover {
  position: absolute;
  top:  50%;
  left: 50%;
  width:  max(100vw, calc(100vh / (9 / 16)));
  height: max(100vh, calc(100vw * (9 / 16)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}

or

:root {
  --youtube-aspect-ratio: (9 / 16);
}
.youtube-background-fixed-contain {
  position: fixed;
  top:  50%;
  left: 50%;
  width:  min(100vw, calc(100vh / var(--youtube-aspect-ratio)));
  height: min(100vh, calc(100vw * var(--youtube-aspect-ratio)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-fixed-cover {
  position: fixed;
  top:  50%;
  left: 50%;
  width:  max(100vw, calc(100vh / var(--youtube-aspect-ratio)));
  height: max(100vh, calc(100vw * var(--youtube-aspect-ratio)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-contain {
  position: absolute;
  top:   0%;
  left: 50%;
  width:  min(100vw, calc(100vh / var(--youtube-aspect-ratio)));
  height: min(100vh, calc(100vw * var(--youtube-aspect-ratio)));
  transform: translate(-50%,   0%);
  pointer-events: none;
  z-index: -1;
}
.youtube-background-cover-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.youtube-background-cover {
  position: absolute;
  top:  50%;
  left: 50%;
  width:  max(100vw, calc(100vh / var(--youtube-aspect-ratio)));
  height: max(100vh, calc(100vw * var(--youtube-aspect-ratio)));
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: -1;
}