video标签默认不是铺满的,即使手动设置宽高100%也不会生效,所以当需要video铺满div时,需要加上一个css样式
<video
controls
style="width: 100%; height: 100%; object-fit: fill"
autoplay
:src="item.video"
></video>
关键是这个“object-fit: fill”,这样就可以解决了!
object-fit 属性指定元素的内容应该如何去适应指定容器的高度与宽度。
object-fit 一般用于 img 和 video 标签,一般可以对这些元素进行保留原始比例的剪切、缩放或者直接进行拉伸等。
fill: 默认,不保证保持原有的比例,内容拉伸填充整个内容容器。