h5 中的视频的问题

Question

问题描述

我想video标签在 按照我给我宽高的来进行播放,但是不能出现黑边

问题出现的环境背景及自己尝试过哪些方法

1. 使用了object-fit: fill; 但是这样的话进入全屏播放的话的 变形太严重了
2. 使用plyr.js, 在video标签外添加一个盒子,将盒子的宽高设置我想要的宽高,使用overflow:hidden进行遮盖, 但是移动端进入全屏模式中 出现下面的情况
   

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

你期待的结果是什么？实际看到的错误信息又是什么？

我希望, 视频内联播放时 不能出现黑边, 全屏模式不能看见其他元素

Answer 1

这个和图片一样的的意思吧，只能按比例缩放。如果没有黑边的话，你的高度就要放大。就是一个等比例。你按照自己的想法就会变形。只能按照它的比例来

Answer 2

这个是拍摄出来的视频本身就这样，你要没黑边，那就把video的宽度变小，变成和视频宽度一样