前端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中对象尺寸最小的一个

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容