前端Vedio设置宽高比

给video包一层div

  <div>
    <video/>
  </div>

设置外层div与vedio的属性

  <div width="你想设置的宽度" height="你想设置的高度">
    <video width = '100%' height = '100%'  object-fit = 'cover'/>
  </div>

同时讲下object-fit的其他属性

contain 被替换的内容内容会缩放，在填充的内容区域内保持默认的宽高比。

cover被替换的内容保持宽高比填充内容框。如果宽高比不一致，会显示裁剪区域。

fill 拉伸填充

none被替换内容保持默认尺寸

scale-down 为none或contain中对象尺寸最小的一个