<video controls="controls" >此标签中添加preload="auto"是预备播放点击后播放， 添加autoplay="autoplay"可以实现自动播放，详见W3school教程：网页链接
父集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
html代码<body>
<DIV id="container">
<DI id="content">
<h1>Content</h1>
<p>请改变浏览器窗口的高度，以观察footer效果。</p>
<p>这里是示例文字，DIV固定………，这里是示例文字。</p>
</DIV>
<DIV Vid="footer">
<h1>Footer</h1>
</DIV>
</DIV>
</body>
CSS代码：
程序代码
body,html{
margin:0
padding:0
font:12px/1.5arial
height:100%
}
#container{
min-height:100%
position:relative
}
#content{
padding:10px
padding-bottom:60px
/*20px(font-size)
x2(line-height)+10px(padding)x2=60px*/
}
#footer{
position:absolute
bottom:0
padding:10px0
background-color:#AAA
width:100%
}
#footerh1{
font:20px/2Arial
margin:0
padding:010px
}
