父集div使用relative定位，padding-bottom值充当空间，子集video元素absolute定位
具体例子如下，比如视频是16:9的比例，这样比例就不会变了，并且适配div的等高比例
css
.vid-wrapper{width:100%
position:relative
padding-bottom:56.25% /*需要用padding来维持16:9比例,也就是9除以16*/
height: 0
}
.vid-wrapper video{
position: absolute
top:0
left: 0
width: 100%
height: 100%
}
html
<div class="vid-wrappper"><video src=""></video>
</div
poster。poster属性规定视频下载时显示的图像，或者在用户点击播放按钮前显示的图像。如果未设置该属性，则使用视频的第一帧来代替。
值为可以是："loop"。空。或者什么都不写poster：一个海报帧的URL，用于在用户播放或者跳帧之前展示。height:视频展示区域的高度，单位是CSS像素。
