更改全屏html5视频的尺寸

Question

有没有办法修改视频的全屏功能在浏览器中的行为方式？我想在屏幕左侧显示视频，在右侧显示图片（实际上是PDF）。

我曾与CSS在Chrome尝试过：

video:-webkit-full-screen 

这给了我一些成果，但不希望的一个。我应该为此创建自定义操作吗？如果是这样，我怎么让视频突破浏览器的边界？

Answer 1

你应该插入一个<div>内<video>标签的定义height和width具有以下属性：

.video-container { 
    position: relative; 
    height: auto; 
    width: 60%; 
} 

video { 
    width: 100%; 
    max-width: 500px; // Or whatever value on your choice 
    height: auto; 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
} 

随着width 100的％，该视频将填补整个浏览器的空间，但限制有多大可以通过设置max-width或max-height来获得分辨率和响应度。我希望我的回答能帮助你！

编辑

以适应一个正确里面div，你必须分配到容器position: relative和position: absolute到影片本身。如果你想突破边界，那么你必须调整视频的max-height和max-width的尺寸。

请检查此question，因为它与您的类似。