動画を背景に使う

制作する際に気をつけるポイント

• 動画ファイルは軽くする（目安は1分くらい）
• デフォルトはミュートの設定
• 自動再生とループの設定にする

HTMにVideoタグを記述

<video id="bgvid" autoplay loop muted>
<source src="dawsonfalls.mp4" type="video/mp4">

画面一面に表示させるCSSの記述

<style>
video#bgvid{
position:fixed;
left: 0;
top: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
background: url(xxx.jpg) no-repeat;/*画像が表示されない場合の代替画像*/
background-size: cover;
display: block;/*IE8以下の対策*/
}
</style>