动态调整视频元素的大小

Question

我想使用的视频应具有浏览器的整个可视区域，并且应在后台运行，而主要的Web内容显示在前景中。

这是我的设置：

video {
  height: 100vh;
  width: 100vw;
}

<video autoplay muted>
<source src="//upload.wikimedia.org/wikipedia/commons/transcoded/9/96/Curiosity%27s_Seven_Minutes_of_Terror.ogv/Curiosity%27s_Seven_Minutes_of_Terror.ogv.480p.vp9.webm" type="video/webm">
</video>

不幸的是，我没有太多的CSS知识。我的问题是，如何设置样式，以使视频占据浏览器中的整个可见区域并且没有空白区域？

我的问题基本上是如何将视频大小动态调整为当前窗口大小。比例缩放很重要，因为视频的高度或宽度可以超出窗口边缘，而其他尺寸仅占整个高度/宽度。