これは古い質問ですが、答えは非常に簡単です。
このhtml5ビデオコード、または次の行に沿った何かを使用してください:
<video id="videobackground" preload autoplay muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
次に、この css を適用します。
#video_background {
position: absolute;
bottom: 0px;
right: 0px;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1000;
overflow: hidden
}
min-height と min-width により、ビデオはビデオの縦横比を維持できます。これは通常、通常のブラウザの通常の解像度での縦横比です。余分なビデオは、ページの端からはみ出します。
私のウェブサイトから詳細を読んでください: HTML ビデオ背景チュートリアル - HTML5 と CSS のみ! http://kesilconsulting.com/web-designer-magazine/html-video-background-tutorial/#ixzz2O3BPNZE6