在我的网站上，<video>中有一个<div>元素。我使用此<div>定义视频宽高比，并让用户在必要时进行更改（有时编码视频的比例不正确）。 <video>始终用<div> CSS属性填充"object-fit: fill;"。
但是...当用户进入全屏模式时，屏幕将成为容器。这是一个问题，因为那里有所有不同的显示比例。
有没有办法操纵/限制全屏尺寸？
<div style="width: 960px; height: 540px; background: #bfbfbf; display: block; margin: 0 auto;">
<video style="object-fit: fill;">
<source src="" />
</video>
</div>
最佳答案
添加“控件”以激活视频控件
<html>
<head>
<style>
.div
{
background-color: #bfbfbf;
width: 960px;
height: 540px;
display: block;
margin: 0 auto;
background-size: cover;
}
</style>
</head>
<body>
<div class="div">
<video style="object-fit: fill; width: 960px; height: 540px;" controls>
<source src="video.mp4" type="video/mp4">
</video>
</div>
</body>
</html>